/* CSS clamp generator */
.container--clamp-tool{max-width:1180px}.clamp-intro{max-width:920px}.size-unit-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem;margin:0 0 1.2rem;padding:.4rem;border:1px solid var(--color-border);border-radius:16px;background:var(--color-surface-soft,#edf5f3)}.size-unit-tab{min-width:0;min-height:52px;padding:.75rem 1rem;border:0;border-radius:12px;background:transparent;color:var(--color-text,#17322f);font:inherit;font-weight:850;cursor:pointer}.size-unit-tab[aria-selected="true"]{background:#fff;color:var(--color-primary,#146b63);box-shadow:0 2px 10px rgba(20,107,99,.14)}.size-unit-tab:focus-visible{outline:3px solid rgba(20,107,99,.34);outline-offset:2px}.size-unit-panel{min-width:0}.size-unit-panel[hidden]{display:none}.clamp-panel{display:grid;gap:1.15rem}.clamp-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem}.clamp-panel-heading h2,.clamp-panel-heading p{margin:0}.clamp-panel-heading p{margin-top:.3rem;color:var(--color-text-muted)}.clamp-reset{min-height:44px}.clamp-property-row,.clamp-field-grid,.clamp-direct-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.clamp-field{display:grid;align-content:start;gap:.4rem;min-width:0;font-weight:800}.clamp-field small{color:var(--color-text-muted);font-weight:400}.clamp-input,.clamp-select{box-sizing:border-box;width:100%;min-width:0;min-height:48px;padding:.7rem .8rem;border:1px solid var(--color-border,#c8d8d5);border-radius:10px;background:#fff;color:var(--color-text,#17322f);font:inherit}.clamp-input:focus,.clamp-select:focus{border-color:var(--color-primary,#146b63);outline:3px solid rgba(20,107,99,.18)}.clamp-input-suffix,.clamp-input-unit{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.5rem;min-width:0}.clamp-input-unit .clamp-select{width:auto;min-width:78px}.clamp-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.35rem;padding:.35rem;border-radius:14px;background:var(--color-surface-soft,#edf5f3)}.clamp-tab{min-width:0;min-height:48px;padding:.7rem .8rem;border:0;border-radius:10px;background:transparent;color:var(--color-text,#17322f);font:inherit;font-weight:800;cursor:pointer}.clamp-tab[aria-selected="true"]{background:#fff;color:var(--color-primary,#146b63);box-shadow:0 2px 8px rgba(20,107,99,.13)}.clamp-tab:focus-visible{outline:3px solid rgba(20,107,99,.34);outline-offset:2px}.clamp-tab-panel{display:grid;gap:1rem;min-width:0}.clamp-tab-panel[hidden],#clamp-custom-wrap[hidden],#clamp-root-wrap[hidden]{display:none}.clamp-presets{padding:1rem;border-radius:14px;background:var(--color-surface-soft,#edf5f3)}.clamp-presets h3,.clamp-presets p{margin:0}.clamp-presets p{margin-top:.25rem;color:var(--color-text-muted)}.clamp-preset-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem;margin-top:.8rem}.clamp-preset-grid button{min-width:0;min-height:42px;padding:.5rem;border:1px solid var(--color-border);border-radius:9px;background:#fff;color:var(--color-text);font:inherit;font-weight:700;cursor:pointer}.clamp-preset-grid button:hover,.clamp-preset-grid button:focus-visible{border-color:var(--color-primary);color:var(--color-primary)}.clamp-unit-field{margin:0;padding:1rem;border:1px solid var(--color-border);border-radius:12px}.clamp-unit-field legend{padding:0 .35rem;font-weight:800}.clamp-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.clamp-choice-grid label{display:flex;align-items:center;gap:.55rem;min-height:44px;padding:.55rem .75rem;border:1px solid var(--color-border);border-radius:10px;background:#fff;font-weight:700;cursor:pointer}.clamp-choice-grid input{inline-size:1.2rem;block-size:1.2rem;accent-color:var(--color-primary)}.clamp-choice-grid label:focus-within{border-color:var(--color-primary);outline:3px solid rgba(20,107,99,.18)}.clamp-root-field{max-width:520px}.clamp-simulator{display:grid;gap:.8rem;padding:1rem;border:1px solid var(--color-border);border-radius:14px;background:#fff}.clamp-simulator-heading{display:flex;align-items:end;justify-content:space-between;gap:1rem}.clamp-simulator-heading .clamp-field{width:min(360px,100%)}.clamp-simulator-heading p{margin:0;color:var(--color-text-muted)}.clamp-range-label{display:grid;gap:.4rem;font-weight:800}.clamp-range-label input{box-sizing:border-box;width:100%;min-width:0;accent-color:var(--color-primary)}.clamp-direct-note{margin:0;padding:.8rem 1rem;border-left:4px solid var(--color-primary);border-radius:8px;background:var(--color-surface-soft)}.clamp-error{min-height:1.5em;margin:0;color:#a12b2b;font-weight:800}.clamp-status,.clamp-copy-status{min-height:1.5em;margin:0;color:var(--color-text-muted);font-weight:700}.clamp-output-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.clamp-code-card{min-width:0;padding:1rem;border:1px solid var(--color-border);border-radius:14px;background:#fff}.clamp-code-card--primary{border-color:#67a89f;background:#f2fbf9}.clamp-code-card h3{margin:0}.clamp-code-card pre{max-width:100%;margin:.7rem 0 0;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word}.clamp-copy-actions{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap}.clamp-copy-actions .button{min-height:44px}.clamp-copy-status{flex:1 1 100%;}.clamp-metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.65rem}.clamp-metrics article{min-width:0;padding:.85rem;border:1px solid var(--color-border);border-radius:12px;background:#fff}.clamp-metrics p{margin:0;color:var(--color-text-muted);font-size:.85rem;font-weight:700}.clamp-metrics output{display:block;margin-top:.4rem;font-weight:800;overflow-wrap:anywhere}.clamp-preview{position:relative;overflow:hidden;display:grid;gap:1rem;padding:1.2rem;border:1px solid var(--color-border);border-radius:16px;background:linear-gradient(135deg,#f2fbf9,#fff)}.clamp-preview h3,.clamp-preview p{margin:0}.clamp-preview>div p{margin-top:.25rem;color:var(--color-text-muted);font-size:.9rem}.clamp-preview-text{display:grid;place-items:center;min-height:140px;padding:1rem;border:1px dashed #8abbb4;border-radius:12px;background:#fff;text-align:center;font-weight:800;line-height:1.35;overflow-wrap:anywhere}.clamp-browser-validation{position:absolute;visibility:hidden;pointer-events:none}.container--clamp-tool [aria-invalid="true"]{border-color:var(--color-danger)}
@media(max-width:900px){.clamp-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.clamp-preset-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.clamp-property-row,.clamp-field-grid,.clamp-direct-grid,.clamp-output-grid{grid-template-columns:1fr}.clamp-simulator-heading{align-items:stretch;flex-direction:column}.clamp-simulator-heading .clamp-field{width:100%}.clamp-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.clamp-tabs,.clamp-choice-grid{grid-template-columns:1fr}.clamp-tab{width:100%}.clamp-copy-actions .button{width:100%}}
@media(max-width:360px){.clamp-panel{padding-inline:.75rem}.clamp-panel-heading{align-items:flex-start;flex-direction:column}.clamp-reset{width:100%}.clamp-preset-grid,.clamp-metrics{grid-template-columns:1fr}.clamp-input,.clamp-select{padding-inline:.55rem}.clamp-input-unit .clamp-select{min-width:72px}.clamp-code-card{padding:.8rem}}
