/* Compact product shell; the original creative and export controls remain intact. */
:root{--red:#234d40;--paper:#f5f5f2;--sans:system-ui,sans-serif;--pad:20px}
html,body{height:100%;font-size:13px}body{display:flex;flex-direction:column;overflow:hidden}.masthead{padding:12px 20px;min-height:60px;border-bottom:1px solid var(--hair);background:white}.brand{gap:10px}.brand strong{font:600 16px system-ui;letter-spacing:-.04em}.brand small{font:11px system-ui;color:#6d746e;border:1px solid #ddd;padding:4px 6px;border-radius:4px}.app-mark{display:grid;place-items:center;background:#234d40;color:white;width:30px;height:30px;border-radius:7px;font-weight:600}.masthead-note{font-size:12px}main{flex:1;min-height:0;display:flex;flex-direction:column}.shell{width:100%;max-width:none}.controls{padding:12px 20px 0;gap:10px;background:white;display:flex;flex-wrap:wrap;border-bottom:1px solid var(--hair)}.format-tabs,.layout-tabs{gap:4px;flex-wrap:wrap}.format-tabs button,.layout-tabs button{padding:7px 9px;font-size:12px;border-radius:5px}.format-tabs button span{display:none}.production-toggles{gap:5px}.production-toggles button{padding:8px 10px;border-radius:5px;font-size:11px}.export-status{min-height:16px;margin:0;font-size:11px}.workspace{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:0;padding:0}.canvas-stage{min-height:0;display:flex;flex-direction:column;gap:18px;padding:16px 24px 22px;overflow:auto;background:#e9ece7}.canvas-toolkit{width:100%;border:0;padding:0;display:flex;gap:12px;align-items:center}.canvas-toolkit>p{margin:0;font-size:10px}.canvas-layer-controls{display:flex;gap:4px;flex-wrap:wrap}.layer-toggle{font-size:10px;padding:5px 7px;border-radius:4px}.canvas-frame{min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;width:100%}.canvas-wrap{container-type:inline-size;flex-shrink:0;filter:drop-shadow(0 8px 16px #1b2b2020);width:min(100%,calc((100dvh - 245px) * .8))!important;transition:none}.canvas-wrap[data-format=instagram-story]{width:min(100%,calc((100dvh - 245px) * .5625))!important}.canvas-wrap[data-format=instagram-square]{width:min(100%,calc(100dvh - 245px))!important}.canvas-wrap[data-format=facebook-link]{width:min(100%,680px,calc((100dvh - 245px) * 1.904))!important}.canvas-hint{font-size:11px;line-height:1.4;margin-top:12px;max-width:none}.spec-panel{display:block;overflow-y:auto;background:#fff;padding:0 18px;border-left:1px solid var(--hair);width:100%;margin:0}.spec-panel details{padding:15px 0;border-bottom:1px solid var(--hair)}.spec-panel summary{cursor:pointer;font-weight:600;font-size:12px;list-style-position:inside}.spec-panel details[open] summary{margin-bottom:14px}.spec-panel label{font-size:11px;letter-spacing:0;gap:4px;margin-bottom:10px}.spec-panel textarea,.spec-panel input{font-size:12px;padding:8px;line-height:1.4}.spec-panel textarea{min-height:50px}.image-choice{aspect-ratio:1.6}.field-help{font-size:11px;line-height:1.5;margin-top:8px}.drop-zone{min-height:90px}.crop-controls{gap:8px;margin-top:12px;padding-top:12px}.canvas-content h2,body .canvas-wrap[data-format=instagram-story] .canvas-content h2,.canvas-wrap[data-layout=guide] .canvas-content h2,.canvas-wrap[data-layout=proof] .canvas-content h2{font-size:10.6cqi;line-height:1.03}.canvas-body{font-size:3.4cqi}.canvas-brand{font-size:2.6cqi;padding:1.5cqi 2cqi;gap:1cqi}.canvas-brand img{width:6.2cqi;height:6.2cqi}.canvas-meta,.canvas-footer{font-size:1.8cqi}.canvas-eyebrow{font-size:1.9cqi}.canvas-action{font-size:2.4cqi}.canvas-wrap[data-layout=guide] .canvas-body,.canvas-wrap[data-layout=proof] .canvas-body{font-size:3.4cqi}.canvas-wrap[data-format=facebook-link] .canvas-content h2{font-size:7.2cqi}.canvas-wrap[data-format=facebook-link] .canvas-body{display:none}.canvas-wrap[data-format=facebook-link] .canvas-content{bottom:12%}
button:focus-visible,summary:focus-visible,a:focus-visible{outline:2px solid #234d40;outline-offset:3px}
@media(max-width:760px){body{height:auto;overflow:auto}.masthead-note{display:none}.controls{padding:10px 14px;gap:9px}.production-toggles{margin-left:0;width:100%}.workspace{display:flex;flex-direction:column}.canvas-stage{padding:16px;overflow:visible;gap:20px}.canvas-toolkit{display:block}.canvas-toolkit>p{margin-bottom:8px}.canvas-layer-controls{display:flex}.canvas-wrap{width:min(85%,360px)!important}.canvas-wrap[data-format=instagram-story]{width:min(70%,270px)!important}.canvas-wrap[data-format=instagram-square],.canvas-wrap[data-format=facebook-link]{width:100%!important}.canvas-frame{flex:auto}.spec-panel{overflow:visible;padding:0 20px;border-left:0}.canvas-hint{max-width:300px;text-align:center}.brand small{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
@media(min-width:761px){.workspace{grid-template-rows:minmax(0,1fr);align-items:stretch}.canvas-stage,.spec-panel{height:100%}.canvas-layer-controls{flex-direction:row;width:auto}.canvas-toolkit{flex-shrink:0}.canvas-layer-controls .layer-toggle{width:auto;flex:0 0 auto}.canvas-frame{justify-content:flex-start}}
@media(max-width:760px){.canvas-layer-controls{flex-direction:row}.canvas-layer-controls .layer-toggle{width:auto}}
/* Denser editing chrome keeps the preview central. */
.masthead{min-height:44px;padding:7px 14px}.app-mark{width:25px;height:25px;border-radius:5px}.brand strong{font-size:14px}.brand small{font-size:9px;padding:3px 5px}.masthead-note{font-size:10px;letter-spacing:.08em}.controls{padding:7px 12px 0;gap:6px}.format-tabs button,.layout-tabs button{font-size:11px;padding:6px 7px}.production-toggles button{font-size:10px;padding:7px 8px}.production-toggles{gap:4px}.export-status{min-height:12px;font-size:10px;line-height:1.2}.workspace{grid-template-columns:minmax(0,1fr) 260px}.canvas-stage{padding:10px 16px 12px;gap:10px}.canvas-toolkit{gap:8px}.canvas-toolkit>p{font-size:9px}.layer-toggle{padding:4px 6px;font-size:9px}.canvas-layer-controls{gap:3px}.canvas-hint{font-size:10px;margin-top:8px}.spec-panel{padding:0 12px}.spec-panel details{padding:11px 0}.spec-panel summary{font-size:11px}.spec-panel details[open] summary{margin-bottom:10px}.spec-panel label{font-size:10px;margin-bottom:8px}.spec-panel textarea,.spec-panel input{font-size:12px;padding:6px 8px}.spec-panel textarea{min-height:42px}.spec-panel textarea[data-field]{height:52px}.field-help{font-size:10px;line-height:1.4}.crop-controls{gap:6px}.drop-zone{min-height:72px;padding:12px}.canvas-wrap{width:min(100%,calc((100dvh - 185px) * .8))!important}.canvas-wrap[data-format=instagram-story]{width:min(100%,calc((100dvh - 185px) * .5625))!important}.canvas-wrap[data-format=instagram-square]{width:min(100%,calc(100dvh - 185px))!important}.canvas-wrap[data-format=facebook-link]{width:min(100%,720px,calc((100dvh - 185px) * 1.904))!important}
@media(max-width:1100px) and (min-width:761px){.masthead-note{display:none}.controls{row-gap:5px}.canvas-wrap{width:min(100%,calc((100dvh - 225px) * .8))!important}.canvas-wrap[data-format=instagram-story]{width:min(100%,calc((100dvh - 225px) * .5625))!important}.canvas-wrap[data-format=instagram-square]{width:min(100%,calc(100dvh - 225px))!important}.canvas-wrap[data-format=facebook-link]{width:min(100%,calc((100dvh - 225px) * 1.904))!important}}
@media(max-width:760px){.masthead{padding:8px 12px}.controls{padding:8px 12px;gap:6px}.format-tabs,.layout-tabs{flex-wrap:nowrap;overflow-x:auto;width:100%;padding-bottom:3px}.format-tabs button,.layout-tabs button{white-space:nowrap;flex-shrink:0}.production-toggles{flex-wrap:nowrap}.production-toggles button{white-space:nowrap}.canvas-stage{padding:12px;gap:12px}.canvas-toolkit>p{display:none}.canvas-layer-controls{flex-wrap:nowrap;overflow-x:auto;padding-bottom:3px}.canvas-layer-controls .layer-toggle{flex-shrink:0}.canvas-wrap{width:min(86%,360px)!important}.canvas-wrap[data-format=instagram-story]{width:min(70%,270px)!important}.canvas-wrap[data-format=instagram-square],.canvas-wrap[data-format=facebook-link]{width:100%!important}.spec-panel{padding:0 14px}}
@media(max-width:760px){.workspace,.canvas-stage,.canvas-toolkit,.canvas-frame{min-width:0;width:100%}.canvas-layer-controls{min-width:0;max-width:100%}}
/* Half-size preview only; exports retain platform-native dimensions. */
@media(min-width:761px){
  .canvas-wrap{width:min(50%,calc((100dvh - 185px) * .4))!important}
  .canvas-wrap[data-format=instagram-story]{width:min(50%,calc((100dvh - 185px) * .28125))!important}
  .canvas-wrap[data-format=instagram-square]{width:min(50%,calc((100dvh - 185px) * .5))!important}
  .canvas-wrap[data-format=facebook-link]{width:min(50%,360px,calc((100dvh - 185px) * .952))!important}
}
@media(max-width:760px){
  .canvas-wrap{width:min(43%,180px)!important}
  .canvas-wrap[data-format=instagram-story]{width:min(35%,135px)!important}
  .canvas-wrap[data-format=instagram-square],.canvas-wrap[data-format=facebook-link]{width:50%!important}
}

.portfolio-back{font:12px system-ui;color:var(--ink);text-decoration:none}.portfolio-back:hover{text-decoration:underline}@media(max-width:480px){.portfolio-back{font-size:10px}}
