.layout>article:has(.utility){min-width:0}.utility{min-width:0}.utility-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.utility-wide{grid-column:1/-1}.utility input,.utility select,.utility textarea{max-width:100%;width:100%;box-sizing:border-box}.utility textarea{min-height:140px;resize:vertical;font:14px/1.6 ui-monospace,monospace}.utility input[type=color]{height:44px}.utility input[type=file]{padding:12px 0}.utility-error{color:#9b2635;background:#fff0f1;padding:12px;border-radius:8px}.utility-result{margin:20px 0;min-width:0;overflow-wrap:anywhere}.utility-result pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#f4f6fa;border:1px solid #d7deea;padding:14px;border-radius:8px;max-height:480px;overflow:auto;font:14px/1.6 ui-monospace,monospace}.utility-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0}.utility-metrics>div{padding:12px;background:#f4f6fa;border-radius:8px;min-width:0}.utility-metrics span,.utility-metrics strong{display:block}.utility-table-wrap{overflow:auto;max-height:420px;margin:14px 0}.utility table{width:100%;border-collapse:collapse;font-size:14px}.utility td,.utility th{padding:10px;border:1px solid #d7deea;text-align:left;white-space:pre-wrap;overflow-wrap:anywhere}.utility-palette{display:flex;flex-wrap:wrap;gap:12px}.utility-swatch{width:110px;height:80px;border:1px solid #a0aec0;border-radius:8px}.utility canvas,.utility svg{max-width:100%;height:auto}.utility-preview{min-height:130px;max-width:260px;margin:25px auto;display:grid;place-items:center;color:#fff;font-weight:650}.utility .actions{flex-wrap:wrap}.utility [data-status]{min-height:1.5em}.utility-typing-sample{padding:14px;background:#eef3ff;border-radius:8px;user-select:none}.utility button:focus-visible,.utility a:focus-visible{outline:3px solid #2459d8;outline-offset:3px}@media(max-width:600px){.utility-form,.utility-metrics{grid-template-columns:1fr}.utility .actions>*{flex:1 1 auto}.utility td,.utility th{padding:7px}}@media print{.utility-form,.utility .actions{display:none}.utility-result pre,.utility-table-wrap{max-height:none;overflow:visible}}
body:has(.utility) .breadcrumbs{white-space:normal;flex-wrap:wrap;overflow-wrap:anywhere}body:has(.utility) .breadcrumbs>span{min-width:0}
body:has(.utility) .page-head h1{font-size:clamp(1.65rem,3vw,2.35rem);line-height:1.18;letter-spacing:-.025em;overflow-wrap:anywhere}body:has(.utility) .verification-strip{display:grid;grid-template-columns:40px minmax(0,1fr)}body:has(.utility) .verification-strip>a{grid-column:2;margin-left:0}body:has(.utility) .verification-strip>div{min-width:0}