/* Keep the existing page designs; only canvas, inherited typography and anchor geometry are shared. */
html:has(#zt-main),body:has(#zt-main){background-color:#000000;}
#zt-main :where(button,input,select,textarea){font-family:inherit;}
#zt-main [id]{scroll-margin-top:100px;}
@media(max-width:768px){#zt-main [id]{scroll-margin-top:88px;}}
@media(prefers-reduced-motion:reduce){#zt-main *,#zt-main *::before,#zt-main *::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;}}

@media(max-width:480px){.ztg4 .ztg4-title{font-size:clamp(28px,9.1vw,44px)!important;overflow-wrap:normal;word-break:normal;}.ztg4 .ztg4-title span{overflow-wrap:normal;word-break:normal;}}

/* Stage 1 — shared mobile canvas safeguards on existing ZT pages. */
html:has(#zt-main), body:has(#zt-main) { overflow-x:clip!important; }
body:has(#zt-main) { margin-inline:0; }
#zt-main { min-width:0; max-width:100%; box-sizing:border-box; }
#zt-main :where(img,video,canvas,iframe) { max-width:100%; }
@supports not (overflow:clip) {
    html:has(#zt-main), body:has(#zt-main) { overflow-x:hidden!important; }
}
@media(max-width:768px) {
    #zt-main :where(section,article,aside,fieldset,form) { min-width:0; max-width:100%; box-sizing:border-box; }
    #zt-main :where(section,article,aside,form) > * { min-width:0; }
    #zt-main :where(h1,h2,h3,h4,p,dd,label,a,button) { overflow-wrap:anywhere; }
    #zt-main :where(input,select,textarea) { min-width:0; max-width:100%; box-sizing:border-box; }
}