/* Public content fills 90% of the available page; artwork remains full width. */
.page{--site-gutter:5%;width:100%;max-width:none;padding-inline:0;box-sizing:border-box}
.page>main#mainContent{width:90%;max-width:none;min-width:0;margin-inline:auto;padding-inline:0;box-sizing:border-box}
.page>main#mainContent.arabian-home{width:100%;max-width:none;padding-inline:0}
.page #mainContent.arabian-home>.home-layout-slot{width:90%;max-width:none;margin-inline:auto}
.page #mainContent:not(.arabian-home)>.home-layout-slot{width:100%;max-width:none;margin-inline:auto}
.page #mainContent .home-layout-slot>:is(section,.arabian-community,.home-community-grid,.home-extra-panel){width:100%;max-width:none;margin-inline:0;box-sizing:border-box}
.page>main#mainContent>:is(.content-card,.auth-layout){width:100%;max-width:none;margin-inline:0;box-sizing:border-box}
.page>.subpage-hero,.page .arabian-home>.arabian-hero{width:100%;max-width:none;margin-inline:0;border-radius:0;box-sizing:border-box}
.page>.topbar.site-header-v127{width:100%;max-width:none;margin-inline:0;padding-inline:5%;box-sizing:border-box}
.page .arabian-hero>.hero-topbar,.page .subpage-hero>.hero-topbar{padding-inline:5%}
.page>.site-footer-v128{width:100%;max-width:none;margin-inline:0;padding-inline:5%;box-sizing:border-box}
.page>.qr-slot-v127{width:90%;max-width:none;margin-inline:auto;box-sizing:border-box}
/* The anonymous studio shares the same measure without the account bootstrap. */
main.coloring-studio{width:90%;max-width:none;min-width:0;margin-inline:auto;padding-inline:0;box-sizing:border-box}
header.studio-header{padding-inline:5%}
header.studio-header>nav{width:100%;max-width:none}
.studio-footer.site-footer-v128{padding-inline:5%}
/* An offscreen honeypot expands the scrollable area in RTL documents. */
.page .mailing-honeypot{position:absolute;inset:0 auto auto 0;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap}
/* Small screens keep usable touch controls within the same 5% side margins. */
@media(max-width:360px){
 main.coloring-studio .paint-quick-tools{flex-wrap:wrap}
 main.coloring-studio .paint-quick-tools button{min-width:0;padding-inline:5px}
 main.coloring-studio #paintQuickColors{gap:7px}
 main.coloring-studio .studio-choose{min-width:0}
 main.coloring-studio .studio-choose label{min-width:0}
}
