/* Shared alignment for every utility-page section */
.utility-page-container{width:min(1180px,calc(100% - 36px));margin-left:auto;margin-right:auto}
.utility-page-hero{padding:38px 0 24px}
.utility-page-hero .utility-page-container,.utility-hub-section .utility-page-container,.utility-workspace .utility-page-container{padding-left:0;padding-right:0}
.utility-page-hero h1{margin-left:0;margin-right:0}
.utility-page-hero p{margin-left:0;margin-right:0}
.utility-hub-section{padding-top:0}
@media(max-width:560px){.utility-page-container{width:min(1180px,calc(100% - 24px))}}

/* HolyHub utility hub – page scoped */
#utilityHub{min-width:0}
.utility-hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.utility-search{max-width:560px;position:relative;flex:1 1 360px}
.utility-search input{width:100%}
.utility-category{margin-bottom:34px}
.utility-category-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:15px}
.utility-category-head h2{margin:0;font-size:24px;letter-spacing:var(--theme-tracking-heading)}
.utility-category-head p{margin:5px 0 0;color:var(--muted,var(--text-sub));font-size:14px}
.utility-hub-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.utility-launcher{appearance:none;-webkit-appearance:none;width:100%;border:var(--theme-border-width) solid var(--line,var(--border-color));background:var(--bg-surface);border-radius:var(--theme-radius-card);padding:20px 14px;min-height:164px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;cursor:pointer;transition:transform var(--theme-motion-fast) ease,box-shadow var(--theme-motion-fast) ease,border-color var(--theme-motion-fast) ease;color:var(--text,var(--text-main));font:inherit;overflow:hidden}
.utility-launcher:hover,.utility-launcher:focus-visible{transform:translateY(-2px);box-shadow:var(--theme-focus-ring);border-color:var(--border-color);outline:none}
.utility-launcher .ico{width:58px;height:58px;border-radius:var(--theme-radius-card);display:grid;place-items:center;background:color-mix(in srgb,var(--brand-accent) 9%,var(--bg-surface));color:var(--primary,var(--brand-accent));flex:0 0 58px}
.utility-launcher .ico svg{width:29px;height:29px;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.utility-launcher strong{display:block;font-size:16px;line-height:var(--theme-leading-body);font-weight:var(--theme-weight-strong);letter-spacing:var(--theme-tracking-body)}
.utility-launcher small{display:block;font-size:12px;color:var(--muted,var(--text-sub));line-height:var(--theme-leading-body);max-width:170px}
.utility-launcher[hidden]{display:none!important}
.utility-workspace{margin-top:8px}
.utility-panel{display:none}
.utility-panel.active{display:block}
.tool-card{padding:28px}
.tool-head{display:flex;align-items:flex-start;gap:15px;padding-bottom:20px;margin-bottom:22px;border-bottom:var(--theme-border-width) solid var(--line,var(--border-color))}
.tool-head .ico{width:50px;height:50px;flex:0 0 50px;border-radius:var(--theme-radius-card);background:color-mix(in srgb,var(--brand-accent) 9%,var(--bg-surface));display:grid;place-items:center;color:var(--primary,var(--brand-accent))}
.tool-head h2{margin:0 0 3px;font-size:25px}
.tool-head p{margin:0;color:var(--muted,var(--text-sub));font-size:14px}
.tool-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.tool-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:12px}
.tool-result{margin-top:18px;padding:17px;border:var(--theme-border-width) solid var(--line,var(--border-color));border-radius:var(--theme-radius-card);background:var(--theme-surface-2);white-space:pre-wrap;overflow-wrap:anywhere}
.tool-result:empty{display:none}
.tool-result canvas,.tool-result img{max-width:100%;height:auto}
.canvas-wrap{display:grid;place-items:center;background:var(--theme-surface-2);border-radius:var(--theme-radius-card);padding:16px;overflow:auto}
.file-drop{border:var(--theme-border-width) dashed var(--border-color);border-radius:var(--theme-radius-card);padding:18px;background:var(--theme-surface-2)}
.mini-note{font-size:12px;color:var(--muted,var(--text-sub));margin-top:7px}
.utility-tabs{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:18px}
.utility-tab{border:var(--theme-border-width) solid var(--line,var(--border-color));background:var(--bg-surface);border-radius:999px;padding:8px 13px;font-weight:var(--theme-weight-medium);font-size:13px;cursor:pointer}
.utility-tab.active{background:var(--primary,var(--brand-accent));color:var(--theme-accent-contrast);border-color:var(--primary,var(--brand-accent))}
.inline-fields{display:flex;gap:9px;align-items:flex-end;flex-wrap:wrap}
.inline-fields>.form-group{flex:1;min-width:140px;margin-bottom:0}
.copy-row{display:flex;gap:8px;align-items:center;min-width:0}.copy-row .input{flex:1;min-width:0}
@media(max-width:1050px){.utility-hub-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){.utility-hub-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-grid-2{grid-template-columns:1fr}.tool-card{padding:20px}}
@media(max-width:460px){.utility-hub-grid{grid-template-columns:1fr 1fr;gap:10px}.utility-launcher{min-height:145px;padding:16px 9px}.utility-launcher .ico{width:50px;height:50px;flex-basis:50px}.utility-launcher strong{font-size:14px}.utility-launcher small{font-size:11px}}

/* Service hub mobile refinements */
@media(max-width:680px){
  .utility-hub-container{width:min(100% - 20px,1180px)!important}
  .utility-tools-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .utility-tool-card{min-width:0!important}
  .utility-hero-actions{align-items:stretch!important;flex-direction:column!important}
  .utility-search{width:100%!important;max-width:none!important}
}
@media(max-width:380px){
  .utility-tools-grid{grid-template-columns:1fr!important}
}
