/* UX36 DEVELOPMENT - Typography, navigation and responsive safeguards for standalone creator tools. */
:root{--ux36-readable-min:15px}
body{font-size:max(15px,1rem);line-height:1.5}
header{min-width:0}
header a, header button, header nav a{font-size:clamp(14px,1.1vw,16px);line-height:1.35;white-space:normal;overflow-wrap:normal;word-break:normal}
header nav{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;min-width:0;max-width:100%;overflow:visible}
button,select,input,textarea{font-size:max(14px,0.95rem);min-height:34px}
button{white-space:normal;overflow-wrap:break-word;line-height:1.35}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #efcd7d;outline-offset:2px}
.panel,.group,.field,.toolbar,section{min-width:0}
.panel p,.muted,.help{line-height:1.5}
.layout{max-width:100vw;min-width:0}
@media (max-width:1080px){header nav{row-gap:10px}.layout{overflow-x:clip}}
@media (max-width:760px){header{flex-wrap:wrap;gap:10px}header nav{width:100%;justify-content:flex-start}.layout{display:flex!important;flex-direction:column;gap:14px;overflow-x:visible}.layout>aside,.layout>main,.layout>section{width:100%!important;max-width:100%!important;min-width:0!important;flex:auto!important}.toolbar,.buttonrow{display:flex;flex-wrap:wrap;gap:8px}.stage-wrap{max-width:100%;overflow:auto}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*{transition-duration:0s!important;animation-duration:0s!important}}

/* UX36 Template Studio: preserve coherent form dimensions and visible preview. */
.ux36-size-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;align-items:end}
.ux36-size-row>label{display:grid;gap:5px;min-width:0;font-size:13px;font-weight:600;color:#bcdbee}
.ux36-size-row input{min-width:0;width:100%;max-width:100%;box-sizing:border-box;font-variant-numeric:tabular-nums}
.ux36-size-row>button{grid-column:1/-1;justify-self:stretch}
#presetGrid button{font-size:clamp(12px,.92rem,15px);padding:9px 7px;min-height:46px;line-height:1.35;text-wrap:balance}
#stage{flex:none;max-width:none;box-sizing:border-box}
.stage-wrap{width:100%;min-width:0;min-height:260px;display:flex;justify-content:center;align-items:flex-start;padding:18px 4px 28px;overflow:auto}
@media(max-width:1090px){.layout{grid-template-columns:minmax(265px,300px) minmax(0,1fr);height:auto!important}.layout>aside.props{grid-column:1/-1}.layout>main,.layout>aside{min-width:0}}
@media(max-width:760px){.layout{display:flex!important;flex-direction:column!important;height:auto!important}.stage-wrap{min-height:300px}}
@media print{header,aside,.toolbar{display:none!important}.layout{display:block!important;height:auto!important}main{border:none!important;background:white!important;overflow:visible!important}.stage-wrap{overflow:visible!important;padding:0!important}#stage{margin:0!important;box-shadow:none!important}}