/* One outer frame for FileMelon's header and every tool page. */
body.site-layout{--site-frame:min(1840px,calc(100% - clamp(28px,6vw,128px)))}
body.site-layout>header:has(.nav-v2){width:calc(100% - 48px);max-width:1160px;margin:12px auto 0;padding:7px 20px;min-height:74px}
body.site-layout>header:has(.nav-v2) .brand-logo{width:222px;margin-top:-3px;margin-bottom:-3px}
body.site-tool-page>main{width:calc(100% - 48px);max-width:1160px;margin-left:auto;margin-right:auto;padding-left:0;padding-right:0}
/* Supporting sections follow the same outer edges as the workspace. */
body.site-tool-page>main>.guide{width:100%;max-width:none;margin:28px 0;padding:24px;border:1px solid #e0e7da;border-radius:14px;background:#fff}
body.site-tool-page>main>.guide>h2:first-child{margin-top:0}
body.site-tool-page>main>.guide p,body.site-tool-page>main>.guide ol{max-width:96ch}
body.site-tool-page>main>.guide a{color:var(--green);text-underline-offset:3px}
body.site-tool-page>main>.format-note{width:100%;max-width:none;margin:18px 0 0;text-align:left}
body.site-layout>footer{width:calc(100% - 48px);max-width:1160px;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px;align-items:center;gap:14px 24px}
body.site-layout>footer>p{margin-top:0;margin-bottom:0}
@media(min-width:1000px) and (max-height:850px){body.site-layout>header:has(.nav-v2){min-height:72px}body.site-layout>header:has(.nav-v2) .brand-logo{width:202px;margin-top:-4.5px;margin-bottom:-4.5px}}
@media(max-width:700px){body.site-layout>header:has(.nav-v2){width:calc(100% - 28px);margin:10px auto 0;padding:9px 12px}body.site-layout>header:has(.nav-v2) .brand-logo{width:207px;margin:0}body.site-tool-page>main{width:calc(100% - 28px)}}
@media(max-width:700px){
 body.site-tool-page>main>.guide{padding:18px;margin:22px 0;border-radius:16px}
 body.site-tool-page>main>.guide h2{font-size:20px;line-height:1.3;margin:22px 0 10px}
 body.site-tool-page>main>.guide ol{padding-left:22px;margin-top:8px}
 body.site-tool-page>main>.guide li{margin:8px 0;font-size:15px;line-height:1.55}
 body.site-tool-page>main>.guide p{font-size:15px;line-height:1.6;margin:10px 0}
 body.site-tool-page .intro p{font-size:16px;line-height:1.5;max-width:38ch}
 body.site-tool-page .workspace{margin-top:18px}
 body.site-tool-page .image-rights-note{font-size:12px;line-height:1.45;color:#61735b}
 body.site-tool-page .hint{font-size:13px;line-height:1.5}
 body.site-layout>footer{width:calc(100% - 28px);padding-left:0;padding-right:0;justify-content:flex-start;gap:14px 20px}
}
/* Use the available browser width rather than a fixed laptop-sized frame. */
.dashboard-tool.dashboard-extra-medium,.dashboard-tool.dashboard-extra-wide{display:none}
@media(min-width:1200px){.dashboard-tool.dashboard-extra-medium{display:grid}}
@media(min-width:1600px){.dashboard-tool.dashboard-extra-wide{display:grid}}
body.site-layout>header:has(.nav-v2),body.site-tool-page>main,body.site-layout>footer,body.dashboard-front>main.tool-dashboard{width:var(--site-frame);max-width:none;margin-left:auto;margin-right:auto}
body.dashboard-front>main.tool-dashboard{padding-left:0;padding-right:0}
@media(min-width:1600px){
 .dashboard-tool-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .dashboard-tool{min-height:112px;padding:16px;grid-template-columns:40px minmax(0,1fr);column-gap:12px}
 .dashboard-tool-icon{width:40px;height:40px}.dashboard-tool-icon svg{width:26px;height:26px}
 .dashboard-tool strong{font-size:19px}.dashboard-tool small{font-size:14px}
 .dashboard-group{padding:24px}.dashboard-groups{gap:24px}
}
