@font-face{font-family:Studio;src:local('Inter'),local('Arial');font-display:swap}
:root{--ink:#263c31;--muted:#778078;--green:#35533f;--lime:#e7edcc;--line:#e4e6df;--paper:#fafbf7;--white:#fff;--soft:#f0f2eb;--serif:Georgia,'Times New Roman',serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font-family:Studio,Arial,sans-serif;font-size:14px;-webkit-font-smoothing:antialiased}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.4;cursor:not-allowed}button{color:inherit}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:3px solid #86a46a;outline-offset:4px}button{border:0;background:none}h1,h2,h3,p{margin:0}button,.drop-zone{transition:background .18s,box-shadow .18s,transform .18s}button:hover:not(:disabled){filter:brightness(.96)}[hidden]{display:none!important}
.site-header{height:85px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 3.8%;gap:24px;background:#fcfdf9}.brand{display:flex;align-items:center;gap:10px;font-size:20px;font-weight:650;letter-spacing:-.6px;white-space:nowrap}.brand-mark{display:flex;align-items:center;gap:3px;background:var(--green);padding:7px;border-radius:9px;width:33px;height:35px}.brand-mark i{display:block;height:22px;width:8px;border:1.3px solid #ecf0d8;border-radius:3px}.brand-mark i:last-child{background:#a7ba91;border:0}.beta{font-size:9px;letter-spacing:1.4px;border:1px solid #dce1d2;padding:5px 6px;border-radius:4px;margin-left:3px;font-weight:500}.site-header nav{display:flex;align-items:center;gap:30px;height:100%;color:#788076;font-size:12px}.site-header nav>a,.site-header nav>button{height:100%;position:relative;white-space:nowrap}.nav-active{color:var(--green);display:flex;align-items:center}.nav-active:after{content:'';position:absolute;bottom:0;height:2px;background:var(--green);left:0;right:0}.plain{padding:0}.lock-mini{margin-right:6px}.session{font-size:11px;color:#677a63;white-space:nowrap}.session i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#819865;margin-right:7px}main{max-width:1680px;margin:auto;padding:0 3.8%}.intro{display:flex;justify-content:space-between;align-items:center;gap:30px;padding:47px 0 37px}.eyebrow{font-size:9px;letter-spacing:1.8px;font-weight:600;color:#74816b;display:flex;align-items:center;gap:8px}.eyebrow>span{height:5px;width:5px;background:#8d9c73;border-radius:50%}h1{font-family:var(--serif);font-weight:400;font-size:clamp(35px,3.6vw,55px);letter-spacing:-1.8px;line-height:1.12;margin:12px 0 15px}h1 em{font-weight:400;color:#72855f}.intro>div>p{font-size:13px;color:#7b8378;line-height:1.7}.mobile-break{display:none}.intro-note{display:flex;gap:15px;border-left:1px solid #dfe5d7;padding-left:27px;align-items:flex-start;margin-right:1%}.shield-icon{width:34px;height:39px;display:grid;place-items:center;border:1px solid #d9e1ce;border-radius:10px 10px 17px 17px;background:#f0f4e8;font-size:16px}.intro-note strong{font-size:12px;font-weight:600}.intro-note p{font-size:11px;color:#7f877b;margin-top:7px}.text-button{font-size:10px;color:#637b53;padding:0}.intro-note .text-button{margin-top:13px}.text-button span{margin-left:10px}.studio{display:grid;grid-template-columns:245px minmax(370px,1fr) 258px;border:1px solid #dfe4d8;border-radius:13px;background:var(--white);overflow:hidden;box-shadow:0 8px 24px #243c2b04}.source-panel{padding:24px 20px;border-right:1px solid var(--line)}.panel-heading{display:flex;gap:9px;align-items:center;margin-bottom:20px}.panel-heading h2,.preview-title h2{font-size:12px;font-weight:600;letter-spacing:-.1px}.step{font-size:9px;font-weight:600;border:1px solid #dfe4d7;border-radius:5px;display:grid;place-items:center;width:23px;height:22px;color:#879379;background:#fcfdf9}.drop-zone{display:flex;align-items:center;flex-direction:column;text-align:center;border:1px dashed #b7c4a4;background:#f9fbf5;padding:24px 8px 20px;border-radius:7px;cursor:pointer;gap:8px}.drop-zone:hover,.drop-zone.dragging{background:#edf3e4;border-color:#6c8954}.drop-zone strong{font-size:12px;font-weight:600}.drop-zone>span:not(.upload-icon){font-size:10px;color:#7e8777}.drop-zone u{color:#546f43;text-decoration:none}.drop-zone small{font-size:9px;color:#8b9384;margin-top:4px}.upload-icon{border:1px solid #dbe3ce;border-radius:8px;width:34px;height:34px;display:grid;place-items:center;font-size:22px;margin-bottom:5px;background:#fff;color:#708359}.file-row{display:flex;align-items:center;gap:8px;padding:15px 0 8px;min-width:0}.file-row>div{min-width:0;flex:1}.file-row strong{font-size:10px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:145px;font-weight:500}.file-row small{font-size:9px;color:#8b9386;display:block;margin-top:4px}.file-symbol{font-size:20px;color:#839670}.icon-button{font-size:20px;color:#8b9383;border-radius:5px;min-width:28px;min-height:28px;display:grid;place-items:center}.icon-button:hover{background:#f2f4ee}.sample-button{font-size:10px;color:#738564;padding:6px 0;display:flex;gap:6px;align-items:center}.divider{height:1px;background:var(--line);margin:20px 0}.panel-heading.compact{margin-bottom:10px}.panel-description{font-size:10px;line-height:1.7;color:#8a9183;margin-bottom:21px}.control{margin:16px 0}.control>label{display:flex;justify-content:space-between;font-size:10px;font-weight:500;margin-bottom:10px}.control output{color:#8a947f;font-size:10px;font-variant-numeric:tabular-nums}.control>p{font-size:9px;color:#969b90;line-height:1.5;margin-top:5px}input[type=range]{width:100%;height:4px;accent-color:#67844f;display:block;cursor:pointer}.inline-control{display:flex;align-items:center;justify-content:space-between;margin-top:20px}.inline-control>label{margin:0}.inline-control select{font-size:10px;color:#6a7c5c;border:1px solid #e1e5d9;border-radius:5px;background:#fafbf7;padding:6px 8px}.switch-row{font-size:10px;display:flex;gap:8px;align-items:center;margin-top:20px;cursor:pointer;color:#7b8771;position:relative}.switch-row input{position:absolute;opacity:0;width:27px;height:17px}.switch{width:27px;height:16px;border-radius:20px;background:#c9cfbf;display:block;padding:3px}.switch:after{content:'';display:block;background:#fff;border-radius:50%;width:10px;height:10px;transition:transform .2s}.switch-row input:checked+.switch{background:#829567}.switch-row input:checked+.switch:after{transform:translateX(11px)}.switch-row input:focus-visible+.switch{outline:3px solid #86a46a;outline-offset:3px}.local-note{display:flex;gap:8px;margin-top:30px;color:#96a087}.local-note>span{font-size:15px}.local-note p{font-size:9px;line-height:1.6}
.preview-panel{background:#f6f7f2;display:flex;flex-direction:column;min-width:0}.preview-toolbar{padding:24px 21px 0;display:flex;align-items:center;justify-content:space-between;gap:8px}.preview-title{display:flex;gap:9px;align-items:center}.concept-badge{font-size:7px;letter-spacing:1px;color:#839076;border:1px solid #dce3d2;border-radius:4px;padding:5px 6px;white-space:nowrap}.pose-tabs{background:#e9ece2;display:flex;border:1px solid #e1e6d8;border-radius:7px;margin:21px auto 5px;padding:3px;gap:2px}.pose-tabs button{font-size:9px;padding:7px 11px;border-radius:5px;color:#7c8771;display:flex;align-items:center;gap:6px;white-space:nowrap}.pose-tabs button.active{background:#fff;color:#52663e;box-shadow:0 1px 3px #253a1720}.pose-tabs button span{font-size:13px}.comparison{display:flex;align-items:center;justify-content:center;gap:14px;padding:25px 22px 12px;min-height:410px;flex:1;background-image:radial-gradient(#b7c5aa50 .6px,transparent .6px);background-size:18px 18px;background-position:0 20px}.comparison figure{margin:0;display:flex;flex-direction:column;align-items:center;min-width:0}.before-figure{width:35%;max-width:165px}.after-figure{width:53%;max-width:250px}figcaption{font-size:9px;color:#6e7b64;display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;margin-bottom:18px}.small-dot{display:inline-block;background:#7a925e;width:5px;height:5px;border-radius:50%}.muted-dot{background:#aab39d}.original-wrap{position:relative;width:100%;border:5px solid #2c302b;border-radius:23px;background:#fff;overflow:hidden;box-shadow:0 9px 20px #23311912;line-height:0;max-height:345px}.original-wrap canvas{width:100%;height:auto;max-height:335px;object-fit:contain;background:#f5f3ed;display:block}.device-wrap{position:relative;width:100%;filter:drop-shadow(0 12px 14px #2b3c2619);line-height:0;max-width:310px}.device-wrap canvas{width:100%;height:auto;display:block;max-height:360px;object-fit:contain}.figure-note{font-size:8px;color:#97a08c;margin-top:15px;white-space:nowrap}.compare-arrow{color:#8c9b7b;font-size:21px;margin-top:24px}.crop-guides{position:absolute;inset:0;pointer-events:none}.crop-top,.crop-bottom{position:absolute;width:100%;background:#9dba7a3b;left:0;display:flex;justify-content:center;align-items:center;min-height:0;overflow:hidden}.crop-top{top:0;border-bottom:1px dashed #7e9a59}.crop-bottom{bottom:0;border-top:1px dashed #7e9a59}.crop-guides span{font-size:6px;color:#476233;letter-spacing:.9px;background:#f1f6e9b8;border-radius:2px;padding:5px 4px;line-height:1}.preview-bottom{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:12px 22px 18px;color:#909b84;font-size:9px}.preview-bottom .text-button{font-size:9px}.pointer{font-size:14px;margin-right:4px}.concept-note{border-top:1px solid #e2e7da;padding:15px 21px;display:flex;gap:8px;align-items:flex-start;background:#f1f3eb;color:#8b947e}.concept-note>span{font-size:12px}.concept-note p{font-size:9px;line-height:1.65}.rail-interactions{position:absolute;right:4%;top:19%;bottom:16%;width:11%;display:flex;flex-direction:column;justify-content:space-between;touch-action:none}.rail-control{position:relative;width:100%;height:17%;min-height:24px;border-radius:9px;border:1px solid transparent;transition:transform .16s,background .16s;outline-offset:1px!important}.rail-control:hover,.rail-control.active,.rail-control:focus-visible{background:#edf2dc55;border-color:#9aaf7a8a;transform:scale(1.12)}.rail-control>span{position:absolute;right:calc(100% + 8px);white-space:nowrap;font-size:9px;line-height:1.3;background:#344b36;color:#f2f4e8;padding:7px 10px;border-radius:6px;opacity:0;transform:translateX(4px);transition:opacity .15s,transform .15s;pointer-events:none;box-shadow:0 3px 10px #20352720}.rail-control:hover>span,.rail-control:focus-visible>span,.rail-control.active>span{opacity:1;transform:translateX(0)}.portrait-mode .rail-interactions{top:auto;bottom:6%;right:13%;left:13%;width:auto;height:9%;flex-direction:row}.portrait-mode .rail-control{height:100%;width:18%}.portrait-mode .rail-control>span{right:50%;top:-30px;transform:translateX(50%)}.open-mode .before-figure{width:27%;max-width:130px}.open-mode .after-figure{width:65%;max-width:340px}.empty-state{flex:1;min-height:410px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:25px}.empty-state>span{font-size:42px;color:#a0af8a}.empty-state h3{font-family:var(--serif);font-size:24px;font-weight:400;margin:12px 0}.empty-state p{font-size:12px;color:#8d9782;line-height:1.6}.empty-state .primary{width:auto;margin-top:24px}
.review-panel{padding:24px 21px 18px;border-left:1px solid var(--line);display:flex;flex-direction:column}.review-intro{background:#f4f7ee;border:1px solid #e6ecda;border-radius:7px;padding:15px 12px;margin-bottom:18px}.leaf-icon{display:inline-grid;place-items:center;background:#e4ebd7;border-radius:6px;width:24px;height:24px;margin-bottom:12px;color:#718457;font-size:17px}.review-intro strong{display:block;font-size:11px;font-weight:500}.review-intro p{font-size:9px;color:#8b967e;line-height:1.6;margin-top:7px}.finding{display:flex;align-items:flex-start;gap:9px;padding:16px 0;border-bottom:1px solid #edf0e7}.finding:last-of-type{border-bottom:0}.finding-number{font-size:8px;color:#95a082;margin-top:2px}.finding h3{font-size:10px;font-weight:500}.finding p{font-size:10px;color:#8b9384;line-height:1.75;margin:8px 0}.finding-tag{font-size:7px;color:#74885b;background:#f0f4e8;padding:4px 6px;border-radius:3px;display:inline-block}.finding-tag.neutral{background:#f1f2ee;color:#909583}.export-area{margin-top:auto;padding-top:24px}.primary,.secondary{display:flex;justify-content:space-between;align-items:center;gap:15px;width:100%;border-radius:6px;padding:12px 13px;font-size:10px;font-weight:500}.primary{background:var(--green);color:#f8f9f0;box-shadow:0 2px 4px #263e2110}.primary:hover{background:#284230}.primary>span,.secondary>span{font-size:15px;font-weight:400}.secondary{border:1px solid #dce3d1;margin-top:9px;color:#748365;background:#fff}.export-area small{display:block;font-size:8px;color:#a0a794;text-align:center;margin-top:12px}.trust-strip{display:grid;grid-template-columns:repeat(3,1fr);margin:29px 0 26px;padding:5px 0}.trust-strip>div{position:relative;padding:0 30px 0 43px;border-right:1px solid #e3e7db}.trust-strip>div:first-child{padding-left:30px}.trust-strip>div:last-child{border:0;padding-left:55px}.trust-strip>div>span{position:absolute;left:15px;top:0;color:#869773;font-size:20px}.trust-strip>div:first-child>span{left:0}.trust-strip>div:last-child>span{left:27px}.trust-strip strong{font-weight:500;font-size:10px}.trust-strip p{font-size:9px;color:#949d88;margin-top:6px}footer{border-top:1px solid #e3e7db;padding:21px 0 28px;display:flex;justify-content:space-between;font-size:9px;color:#9ca590;gap:20px}.footer-brand{color:#6c7c5e;font-weight:500}.footer-brand>span{color:#a1a991;margin-left:12px;font-weight:400}footer>div{display:flex;gap:25px}footer a{color:#7f8d70}dialog{border:1px solid #d9e0d0;border-radius:16px;background:#fcfdf9;padding:30px;max-width:520px;width:calc(100% - 32px);color:var(--ink);box-shadow:0 20px 80px #1f312b30}dialog::backdrop{background:#263a3055;backdrop-filter:blur(4px)}.dialog-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}dialog h2{font:400 31px/1.2 var(--serif);letter-spacing:-.6px}dialog h2 em{color:#7b8e66}dialog>p{font-size:12px;line-height:1.8;color:#7a8771;margin-top:18px}dialog ul,dialog ol{padding-left:19px;margin:20px 0;font-size:11px;line-height:1.8;color:#7f8b76}dialog li{padding-left:5px;margin-bottom:12px}dialog li strong{color:#4f6742;font-weight:500}.dialog-note{background:#f0f3e9;border:1px solid #e2e8d7;border-radius:7px;padding:13px;font-size:10px;line-height:1.8;color:#7e8a70;margin:20px 0}dialog>.primary{justify-content:center}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,15px);background:#304a37;color:#f6f8ed;padding:13px 20px;border-radius:8px;font-size:12px;line-height:1.5;box-shadow:0 5px 25px #1a35222a;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:20;max-width:calc(100% - 32px)}.toast.visible{opacity:1;transform:translate(-50%,0)}
@media(min-width:1450px){.studio{grid-template-columns:270px minmax(450px,1fr) 285px}.source-panel,.review-panel{padding:27px}.comparison{min-height:460px}.before-figure{max-width:175px}.after-figure{max-width:265px}.original-wrap{max-height:370px}.original-wrap canvas{max-height:360px}.device-wrap canvas{max-height:380px}}
@media(max-width:1150px){main{padding:0 25px}.site-header{padding:0 25px}.site-header nav{gap:20px}.session{display:none}.studio{grid-template-columns:205px minmax(325px,1fr) 215px}.source-panel,.review-panel{padding:20px 15px}.preview-toolbar{padding:20px 15px 0}.preview-title h2{font-size:11px}.concept-badge{font-size:6px;padding:4px}.intro-note{padding-left:20px}.comparison{padding:25px 14px;gap:10px}.pose-tabs button{padding:6px 9px}.preview-bottom{margin-left:15px;margin-right:15px;font-size:8px}.preview-bottom .text-button{font-size:8px}}
@media(max-width:950px){.studio{grid-template-columns:215px minmax(350px,1fr)}.review-panel{grid-column:1/-1;border-left:0;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);gap:0 22px;padding:22px}.review-panel>.panel-heading{grid-column:1/-1;margin-bottom:4px}.review-intro{display:none}.finding{border:0}.export-area{grid-column:1/-1;display:flex;align-items:center;gap:12px;margin:0;padding:15px 0 0;border-top:1px solid var(--line)}.export-area button{max-width:220px}.export-area .secondary{margin:0}.export-area small{margin:0;text-align:left;font-size:9px}.intro-note{display:none}.intro{padding-top:35px}.comparison{min-height:400px}.before-figure{max-width:155px}.after-figure{max-width:230px}.concept-badge{font-size:7px}.preview-title h2{font-size:12px}}
@media(max-width:640px){.site-header{height:69px;padding:0 18px;gap:10px}.brand{font-size:18px;gap:7px}.beta{display:none}.site-header nav{gap:15px}.site-header nav>a{display:none}.site-header nav>button{font-size:10px}.lock-mini{display:none}main{padding:0 16px}.intro{padding:30px 2px 24px}.eyebrow{font-size:8px;letter-spacing:1.5px}h1{font-size:39px;letter-spacing:-1.5px}.intro>div>p{font-size:11px}.mobile-break{display:block}.studio{display:flex;flex-direction:column}.source-panel{padding:20px;border-right:0;border-bottom:1px solid var(--line)}.source-panel .panel-heading{margin-bottom:15px}.drop-zone{padding:18px 8px}.drop-zone .upload-icon{margin:0}.drop-zone>strong{font-size:13px}.file-row{padding-top:12px}.file-row strong{max-width:230px}.source-panel .divider{margin:15px 0}.source-panel .control{margin-top:16px}.source-panel .local-note{margin-top:20px}.panel-description{margin-bottom:10px}.control>label,.switch-row,.inline-control select{font-size:11px}.control>p{font-size:10px}.source-panel{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.source-panel>.panel-heading,.drop-zone,.file-row,.sample-button,.divider,.panel-description,.local-note{grid-column:1/-1}.source-panel .sample-button{justify-self:start}.source-panel .inline-control{grid-column:1/-1}.source-panel .switch-row{grid-column:1/-1}.preview-toolbar{padding:20px 16px 0}.comparison{padding:25px 17px;min-height:380px;gap:12px}.before-figure{width:37%;max-width:145px}.after-figure{width:53%;max-width:220px}.original-wrap{border-width:4px;border-radius:20px}.review-panel{display:block;padding:22px}.review-panel .panel-heading{margin-bottom:10px}.finding{border-bottom:1px solid #edf0e7}.finding h3{font-size:12px}.finding p{font-size:11px}.finding-tag{font-size:9px}.review-intro{display:none}.export-area{display:block;border:0}.export-area button{max-width:none;font-size:12px;padding:14px}.export-area .secondary{margin-top:10px}.export-area small{text-align:center;margin-top:12px}.trust-strip{display:flex;flex-direction:column;gap:23px;padding:0 8px;margin:28px 0}.trust-strip>div,.trust-strip>div:first-child,.trust-strip>div:last-child{padding-left:32px;border:0}.trust-strip>div>span,.trust-strip>div:first-child>span,.trust-strip>div:last-child>span{left:0}.trust-strip strong{font-size:11px}.trust-strip p{font-size:10px}footer{flex-direction:column;font-size:9px;gap:14px}footer>div{justify-content:space-between;gap:12px}.concept-note p{font-size:10px}.preview-bottom{font-size:8px}.pose-tabs button{font-size:10px;padding:8px 12px}.open-mode .comparison{gap:8px;padding:25px 10px}.open-mode .before-figure{width:25%}.open-mode .after-figure{width:65%}.open-mode figcaption{font-size:7px}.open-mode .figure-note{font-size:6px}dialog{padding:24px}dialog h2{font-size:28px}}
.device-wrap{border:5px solid #2c302b;border-radius:23px;overflow:hidden;background:#eff0e8}.rail-interactions .rail-control{flex:1;min-height:0}.portrait-mode .rail-control{height:100%}.figure-note{font-size:9px}.finding-tag{font-size:8px}.concept-badge{font-size:8px}.preview-panel .comparison.open-mode{gap:10px}.preview-panel .comparison.open-mode .before-figure{width:27%;max-width:130px}.preview-panel .comparison.open-mode .after-figure{width:65%;max-width:340px}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Beta workspace: readable controls and an explicit, editable visual treatment. */
:root{--muted:#556354}
.site-header nav{color:#52624f;font-size:13px}
.beta{color:#36533d;border-color:#a8b69d}
.intro>div>p{color:#53614f;font-size:15px}
.intro-note p,.intro-note .text-button{color:#52634b;font-size:12px}
.studio{grid-template-columns:280px minmax(420px,1fr) 250px}
.panel-heading h2,.preview-title h2{font-size:14px}
.step{color:#536448}
.drop-zone strong{font-size:14px}
.drop-zone>span:not(.upload-icon),.drop-zone small{font-size:12px;color:#53634b}
.file-row strong{font-size:12px;max-width:185px}
.file-row small,.sample-button{font-size:12px;color:#56684c}
.icon-button{color:#53634b;min-width:36px;min-height:36px}
.panel-description,.control>p,.style-control p,.nav-editor>p{color:#53624d;font-size:12px;line-height:1.65}
.control>label,.control output,.inline-control>label,.switch-row{font-size:13px;color:#405239}
.control>label{margin-bottom:4px}
input[type=range]{height:24px;margin:0;accent-color:#4f713c}
.inline-control select{font-size:12px;color:#405239;min-height:36px}
.style-control{grid-column:1/-1;margin-bottom:14px}
.style-control>label{display:block;font-size:13px;font-weight:600;margin-bottom:8px}
.style-control>select{width:100%;max-width:100%;min-height:42px;font-size:12px;background:#f6f8f0;color:#304b36;border:1px solid #bdc9b2;border-radius:7px;padding:8px}
.style-control p{margin-top:8px}
.solid-option{margin-top:0;margin-bottom:18px;grid-column:1/-1}
.switch-row{min-height:30px;line-height:1.4}
.switch-row input:disabled+.switch{opacity:.45}
.nav-editor{grid-column:1/-1;border:1px solid #d5ddcc;border-radius:8px;padding:12px;margin:16px 0 4px;background:#fafcf6}
.nav-editor summary{font-size:12px;font-weight:600;cursor:pointer;line-height:1.5;color:#36533d}
.nav-editor summary:focus-visible{outline:3px solid #6a8c53;outline-offset:4px}
.nav-editor>p{margin:12px 0}
.nav-edit-row{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:8px;margin-top:12px}
.nav-edit-row label{font-size:11px;line-height:1.4;color:#455a3c;min-width:0}
.nav-edit-row input,.nav-edit-row select{display:block;width:100%;min-width:0;min-height:36px;margin-top:5px;padding:7px;border:1px solid #becbb1;border-radius:5px;background:#fff;color:#293c29;font-size:12px}
.local-note,.local-note p{color:#53634b;font-size:12px}
.pose-tabs button{font-size:12px;padding:10px 13px;color:#4d6140;min-height:40px}
.pose-tabs button.active{color:#263f2a}
.concept-badge{font-size:9px;color:#536448}
.comparison{min-height:510px;flex:0 0 auto;padding-top:35px;padding-bottom:28px}
.before-figure{width:34%;max-width:180px}
.after-figure{width:55%;max-width:290px}
.original-wrap,.original-wrap canvas,.device-wrap canvas{max-height:none}
.device-wrap{max-width:none}
.device-wrap canvas{display:block;width:100%;height:auto}
figcaption{font-size:11px;color:#506344;white-space:normal;text-align:center;line-height:1.4}
.figure-note{font-size:11px;color:#536448;white-space:normal;text-align:center;line-height:1.4}
.preview-panel .comparison.open-mode .before-figure{width:27%;max-width:145px}
.preview-panel .comparison.open-mode .after-figure{width:66%;max-width:470px}
.preview-bottom{font-size:11px;color:#4c6240;line-height:1.5;flex-wrap:wrap;justify-content:space-between;margin-top:12px}
.preview-bottom .text-button{font-size:11px;min-height:36px}
.concept-note{margin-top:auto;color:#4c5f40}
.concept-note p{font-size:12px}
.rail-control>span{font-size:11px}
.review-intro strong{font-size:13px}
.review-intro p,.finding p{font-size:12px;color:#53624d}
.finding h3{font-size:13px;font-weight:600}
.finding-number{font-size:10px;color:#586e46}
.finding-tag,.finding-tag.neutral{font-size:10px;color:#4b613b;background:#edf2e4}
.primary,.secondary{font-size:12px;min-height:44px}
.secondary{color:#476035}
.export-area small{font-size:11px;color:#586a49;line-height:1.5}
.trust-strip strong{font-size:12px}
.trust-strip p{font-size:12px;color:#57674d;line-height:1.5}
footer,footer .footer-brand>span,footer a{font-size:11px;color:#56694a}
dialog>p,dialog ul,dialog ol{font-size:14px;color:#4f6145}
.dialog-note{font-size:13px;color:#4f6145}
@media(max-width:1240px) and (min-width:741px){
  .studio{grid-template-columns:270px minmax(0,1fr)}
  .review-panel{grid-column:1/-1;border-left:0;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 24px;padding:24px}
  .review-panel>.panel-heading{grid-column:1/-1;margin-bottom:4px}
  .review-intro{display:none}
  .finding{border:0}
  .export-area{grid-column:1/-1;display:flex;align-items:center;gap:14px;margin:0;padding:18px 0 0;border-top:1px solid var(--line)}
  .export-area button{max-width:235px}
  .export-area .secondary{margin:0}
  .export-area small{margin:0;text-align:left}
}
@media(max-width:950px){
  .studio{grid-template-columns:240px minmax(0,1fr)}
  .comparison{min-height:430px;padding-left:14px;padding-right:14px;gap:10px}
  .preview-title h2{font-size:13px}
  .preview-toolbar{flex-wrap:wrap}
  .pose-tabs button{padding:9px;font-size:11px}
  .nav-edit-row{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:740px){
  .studio{display:flex;flex-direction:column}
  .source-panel,.preview-panel,.review-panel{width:100%}
  .source-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 16px;padding:20px;border-right:0;border-bottom:1px solid var(--line)}
  .source-panel>.panel-heading,.source-panel>.drop-zone,.file-row,.sample-button,.divider,.panel-description,.local-note,.inline-control,.switch-row{grid-column:1/-1}
  .source-panel .sample-button{justify-self:start}
  .file-row strong{max-width:230px}
  .nav-edit-row{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}
  .comparison{min-height:380px;padding:28px 14px}
  .review-panel{display:block;border-left:0;border-top:1px solid var(--line);padding:22px}
  .review-intro{display:none}
  .finding{border-bottom:1px solid #e4e9dc}
  .export-area{display:block}
  .export-area button{max-width:none}
  .export-area .secondary{margin-top:10px}
  .export-area small{text-align:center;margin-top:12px}
  .concept-badge{font-size:8px}
  .pose-tabs button{font-size:11px;padding:10px}
  figcaption,.figure-note{font-size:10px}
  .preview-panel .comparison.open-mode figcaption{font-size:10px}
  .preview-panel .comparison.open-mode .figure-note{font-size:10px}
  .beta{display:inline;font-size:8px;letter-spacing:.5px;margin-left:0}
  .site-header nav{gap:12px}
}
@media(max-width:380px){
  .site-header{padding:0 12px}.brand{font-size:16px}.brand-mark{width:27px;padding:5px}.site-header nav>button{font-size:9px}
  .preview-title h2{font-size:12px}.concept-badge{display:none}
}
/* Bound tall uploads by shrinking the entire frame, keeping crop guides aligned. */
.original-wrap{--frame-border:5px;border-width:var(--frame-border);width:min(100%,calc(420px * var(--source-ratio, .462) + 2 * var(--frame-border)))}
@media(max-width:640px){.original-wrap{--frame-border:4px}}
.mobile-jump{display:none}
@media(max-width:740px){
  .source-panel .sample-button{grid-column:1}
  .mobile-jump{display:inline-flex;align-items:center;min-height:36px;color:#405c33;font-size:12px;text-decoration:underline;text-underline-offset:3px}
  .jump-preview{grid-column:2;justify-self:end}
  .preview-bottom>span{flex-basis:100%}
}
.example-menu,.example-credit{grid-column:1/-1}
.example-menu{display:grid;gap:0;margin:16px 0 0}
.example-menu h3{font-size:13px;color:var(--ink);margin:0 0 6px}
.example-menu a{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:38px;padding:6px 2px;border-bottom:1px solid var(--line);color:#36533d;font-size:12px;font-weight:600}
.example-menu a:hover,.example-menu a:focus-visible{text-decoration:underline;text-underline-offset:3px}
.example-menu small{font-size:10px;font-weight:400;text-align:right;color:#53634b}
.example-credit{font-size:12px;color:#53634b;line-height:1.55;margin-top:10px}
.example-credit a{color:#36533d;text-decoration:underline;text-underline-offset:2px}

.source-device-control{margin-top:12px}
.strip-control{grid-column:1/-1}
.crop-guides .crop-right{position:absolute;right:0;top:0;height:100%;background:#44576b42;border-left:1px dashed #354e64}
.concept-note a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.output-size-control{min-width:0;margin:0 0 10px}
.output-size-control select{width:100%}
.export-area{flex-wrap:wrap}
.export-area .output-size-control{flex-basis:100%}
.export-area .output-size-control select{max-width:280px}
#sourceSize,#targetSize,.export-area small{font-variant-numeric:tabular-nums}
.comparison.matched-displays{gap:10px}
.comparison.matched-displays .compare-arrow{flex:0 0 16px;width:16px}
.studio .comparison.matched-displays .before-figure{width:min(calc((100% - 36px) * var(--source-share)),var(--source-limit));max-width:none}
.studio .comparison.matched-displays .after-figure{width:min(calc((100% - 36px) * var(--target-share)),var(--target-limit));max-width:none}
.comparison.matched-displays .original-wrap,.comparison.matched-displays .device-wrap{width:100%;border:0;box-shadow:0 0 0 3px #2c302b}
.source-device-control{grid-column:1/-1;min-width:0;border:0;margin:14px 0 4px;padding:0}
.source-device-control legend{font-size:13px;font-weight:600;color:var(--ink);padding:0 0 6px}
.source-switch{display:grid;grid-template-columns:1fr 1fr 1.25fr;gap:2px;padding:3px;background:#ebeee5;border:1px solid #d9dfd0;border-radius:8px}
.source-switch label{position:relative;min-width:0;cursor:pointer}
.source-switch input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;margin:0}
.source-switch span{min-height:40px;display:grid;place-items:center;border-radius:5px;font-size:12px;color:#475d3d}
.source-switch input:checked+span{background:white;color:#263f2a;font-weight:600;box-shadow:0 1px 4px #253a1729}
.source-switch input:focus-visible+span{outline:2px solid #49683a;outline-offset:1px}
.source-device-control small{display:block;color:#53634b;font-size:11px;line-height:1.5;margin-top:6px}

.layout-editor{grid-column:1/-1;min-width:0;border:0;padding:0;margin:12px 0 4px}
.layout-editor legend,.order-editor label{font-size:12px;font-weight:600;color:var(--ink)}
.layout-editor legend{padding:0 0 5px}
.layout-editor>select,.order-editor input,.order-editor textarea{width:100%;min-width:0;padding:8px;border:1px solid #b9c4b1;border-radius:6px;background:#fff;color:var(--ink);font:inherit;font-size:13px}
.order-editor{margin-top:10px}
.order-editor summary{cursor:pointer;color:#344f35;font-size:13px;font-weight:600;padding:6px 0}
.order-editor p{font-size:12px;line-height:1.5;color:#53634b;margin:4px 0 10px}
.order-editor label{display:block;margin:0 0 9px}
.order-editor input,.order-editor textarea{display:block;margin:3px 0 0;font-weight:400}
.order-editor textarea{resize:vertical}
.photo-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.composition-guide{position:absolute;left:0;border-top:2px dashed #227272;pointer-events:none}
.composition-guide.photo-guide{border-bottom:2px dashed #227272;background:rgba(70,175,162,.08)}
.comparison .rail-interactions.horizontal-rail{flex-direction:row}
.comparison .rail-interactions.vertical-rail{flex-direction:column}
@media(max-width:740px){
  .preview-panel{order:-1}
}
.project-screens{grid-column:1/-1;margin:14px 0 4px}
.project-screens h3{font-size:13px}
.project-screens p{font-size:11px;line-height:1.5;color:#53634b}
.project-screens [data-screen]{display:flex;align-items:center;gap:5px;margin:6px 0}
.project-screens [data-screen] input{width:100%;min-width:0;font:inherit;font-size:13px;padding:7px;border:1px solid #bcc8b4;border-radius:5px;color:var(--ink)}
.project-screens [data-remove]{background:transparent;border:0;color:#45613c;min-width:32px;min-height:32px;font-size:17px;cursor:pointer}
.add-screens{display:inline-flex;align-items:center;position:relative;min-height:38px;font-weight:600;font-size:12px;color:#3b5635;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.add-screens input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.add-screens:focus-within{outline:2px solid #45613c}
#browseSettings,#staticStyleControl{grid-column:1/-1}
.device-wrap{position:relative}
#explorerHost{position:absolute;inset:0;overflow:hidden;text-align:left;border-radius:inherit}
#enlargeDialog{width:min(98vw,1050px);max-width:none;padding:15px;background:#f4f3ef}
#enlargeDialog .dialog-top{margin-bottom:10px}
#enlargeTitle{font:600 15px/1.2 -apple-system,BlinkMacSystemFont,Arial,sans-serif;margin:0}
.expanded-stage{position:relative;width:min(100%,calc(78vh * var(--expanded-ratio,1.4)));margin:auto;aspect-ratio:var(--expanded-ratio,1.4);overflow:hidden;border-radius:12px;background:white}
.expanded-stage>canvas{display:block;width:100%;height:100%}
@media(min-width:1000px){
  .studio.live-workspace{display:grid;grid-template-columns:252px minmax(0,1fr);grid-template-rows:auto 1fr}
  .live-workspace .source-panel{grid-column:1;grid-row:1/3}
  .live-workspace .preview-panel{grid-column:2;grid-row:1}
  .live-workspace .review-panel{display:grid;grid-column:2;grid-row:2;grid-template-columns:1fr 1fr;gap:8px 22px;border:0;border-top:1px solid var(--line);padding:18px 22px;align-content:start}
  .live-workspace .review-panel .review-intro,.live-workspace .review-panel .finding:nth-last-of-type(2){display:none}
  .live-workspace .review-panel>.panel-heading,.live-workspace .review-panel .export-area{grid-column:1/-1}
  .live-workspace .review-panel .finding{border:0}
  .live-workspace .export-area{display:flex;align-items:center;gap:12px;margin-top:0}
  .live-workspace .export-area button{max-width:210px;margin:0}
  .live-workspace .export-area .output-size-control{flex-basis:auto}
  .live-workspace .preview-panel .comparison:not(.matched-displays) .before-figure{width:20%;max-width:148px}
  .live-workspace .preview-panel .comparison.open-mode:not(.matched-displays) .after-figure{width:75%;max-width:765px}
  .live-workspace .preview-panel .comparison:not(.open-mode):not(.matched-displays) .after-figure{width:50%;max-width:345px}
  .live-workspace .preview-panel .device-wrap{max-width:none;width:100%}
}

.preview-instructions{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:5px 16px;margin:6px 0 8px}
.preview-instructions p,.preview-instructions button{font-size:12px;line-height:1.4}
.preview-instructions p{margin:0;color:#43583c}
.preview-instructions button{min-height:34px}

.destination-editor{grid-column:1/-1;margin:12px 0;border:1px solid #c6cfc0;border-radius:8px;padding:4px 10px;background:#f7f8f4}
.destination-editor>summary{font-weight:650;font-size:13px;padding:9px 0;cursor:pointer;color:#304732}
.destination-editor p{font-size:12px;line-height:1.45;color:#4d6048;margin:4px 0 9px}
.destination-row{border-top:1px solid #d9e0d4;padding:9px 0;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:5px 7px}
.destination-row label{font-size:11px;color:#52634e;display:block}
.destination-row input,.destination-row select{width:100%;min-width:0;border:1px solid #b9c4b1;border-radius:5px;background:#fff;color:#25372a;font:inherit;font-size:12px;padding:7px 4px;display:block;margin-top:3px}
.destination-row details{grid-column:1/-1}
.destination-row details summary{font-size:11px;color:#40583e;cursor:pointer;padding:4px 0}
.destination-row details label{margin-top:4px}
.destination-row.removed-tab input{color:#5b6559;text-decoration:line-through}
.destination-editor .text-button{min-height:34px}

.project-screens [data-make-start]{border:1px solid #bcc8b4;border-radius:5px;background:#f4f7ef;color:#34562c;padding:7px;font-size:11px;white-space:nowrap;cursor:pointer}
#conversionSummary{font-weight:700;color:var(--ink);margin-bottom:6px}
