.expanded-tool{max-width:1060px;margin-inline:auto}.expanded-tool .page-heading h1{font-size:clamp(26px,3vw,36px)}.expanded-tool .local-label{margin-top:10px;font-size:12px}.expanded-tool .expanded-panel{border:1px solid var(--border);background:var(--surface);border-radius:12px;padding:20px}.expanded-tool h2{margin-bottom:12px;font-size:17px}.expanded-tool label{min-width:0;color:var(--muted);flex-direction:column;gap:8px;font-size:13px;display:flex}.expanded-tool label+label{margin-top:12px}.expanded-tool .control-row{flex-wrap:wrap;align-items:center;gap:12px;margin-block:16px;display:flex}.expanded-tool .control-row label{max-width:100%;margin:0}.expanded-tool .grow{flex:1}.expanded-tool input,.expanded-tool select,.expanded-tool textarea{color:var(--text);background:var(--soft);border:1px solid var(--border);border-radius:7px;min-width:0;max-width:100%;padding:9px 12px}.expanded-tool input[type=number]{width:100px}.expanded-tool input[type=color]{width:64px;height:42px;padding:4px}.expanded-tool input[type=checkbox],.expanded-tool input[type=range],.expanded-tool meter{accent-color:var(--accent)}.expanded-tool .inline-label,.expanded-tool .control-row label:has(input[type=checkbox]){flex-direction:row;align-items:center}.expanded-tool textarea{resize:vertical;width:100%;min-height:180px;font:13px/1.8 ui-monospace,monospace}.expanded-tool textarea[readonly]{background:var(--surface)}.expanded-tool .field-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.expanded-tool .field-grid label{margin:0}.expanded-tool .button.primary{background:var(--action-bg);border-color:var(--action-bg);color:var(--action-text)}.expanded-tool .button.primary:hover{background:var(--action-hover)}.expanded-tool button:disabled{opacity:.45;cursor:default}.expanded-tool .field-note{color:var(--muted);margin-top:12px;font-size:12px;line-height:1.8}.expanded-tool .expanded-status{border:1px solid var(--border);color:var(--muted);background:var(--soft);overflow-wrap:anywhere;border-radius:8px;margin-top:14px;padding:12px 16px;font-size:12px}.expanded-tool .expanded-status[data-error=true]{color:var(--error)}.expanded-tool .color-preview{border:1px solid var(--border);border-radius:9px;height:130px;margin-block:20px}.expanded-tool .format-list>div{border-bottom:1px solid var(--border);padding:12px 0}.expanded-tool dt{color:var(--muted);font-size:12px}.expanded-tool dd{overflow-wrap:anywhere;margin:6px 0 0}.expanded-tool .format-list dd{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.expanded-tool .format-list output{font:14px ui-monospace,monospace}.expanded-tool .contrast-sample{border-radius:8px;margin-top:20px;padding:28px}.expanded-tool .contrast-sample strong{font-size:28px}.expanded-tool .large-result{margin-top:20px;font-size:30px}.expanded-tool pre,.expanded-tool .multiline{white-space:pre-wrap;overflow-wrap:anywhere}.expanded-tool pre{background:var(--soft);border:1px solid var(--border);border-radius:8px;padding:14px;font-size:12px}.expanded-tool .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;display:grid}.expanded-tool .metric-grid dd{font-size:20px}.expanded-tool .qr-preview{width:min(100%,320px);height:auto;margin:20px auto;display:block}.expanded-tool .image-preview{object-fit:contain;max-width:100%;max-height:400px;margin:20px auto}.expanded-tool meter{width:100%;height:22px;margin-top:16px;display:block}.expanded-tool .diff-result{white-space:pre;max-height:600px;font:13px/1.8 ui-monospace,monospace;overflow:auto}.expanded-tool [data-change=added]{color:var(--success);background:var(--success-bg)}.expanded-tool [data-change=removed]{color:var(--error);background:var(--error-bg)}.expanded-tool #pixel-dialog{width:100vw;max-width:none;height:100dvh;max-height:none;color:var(--text);background:var(--surface);border:0;margin:0;padding:0;position:fixed;inset:0}.expanded-tool #pixel-dialog[open]{flex-direction:column;display:flex}.expanded-tool .pixel-controls{background:var(--surface);flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;padding:12px;display:flex}.expanded-tool #pixel-surface{background:#fff;flex:1;min-height:0}@media (width<=650px){.expanded-tool .expanded-panel{padding:14px}.expanded-tool .field-grid,.expanded-tool .metric-grid{grid-template-columns:minmax(0,1fr)}.expanded-tool .control-row{gap:10px}.expanded-tool .control-row .grow{flex-basis:100%}}
