.tools-app [hidden],.tools-preview [hidden]{display:none!important}.tools-hero{text-align:center;padding-block:clamp(2.5rem,6vw,4.5rem) 1.5rem}.tools-eyebrow{background:rgba(var(--p-rgb) / .14);color:var(--p);font-family:var(--font-display);font-size:var(--fs-sm);border-radius:999px;margin:0 0 .9rem;padding:.35rem .8rem;font-weight:600;display:inline-block}.tools-hero h1{font-family:var(--font-display);font-size:var(--fs-h2);margin:0 0 1rem;line-height:1.1}.tools-lead{max-width:62ch;color:var(--text-2);font-size:var(--fs-lg);margin:0 auto}.tools-app{padding-bottom:var(--section)}.tool-tabs{flex-wrap:wrap;justify-content:center;gap:.4rem;margin-bottom:1.5rem;display:flex}.tool-tab{border:1px solid var(--line-strong);background:var(--surface);color:var(--text-2);font-family:var(--font-display);font-weight:500;font-size:var(--fs-sm);cursor:pointer;border-radius:999px;padding:.6rem 1rem}.tool-tab[aria-selected=true]{background:var(--p);color:var(--accent-text);border-color:#0000;font-weight:600}.tools-grid{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);grid-template-columns:minmax(0,1fr) minmax(0,320px);align-items:start;gap:clamp(1.25rem,3vw,2.5rem);padding:clamp(1.1rem,3vw,2rem);display:grid}@media (width<=760px){.tools-grid{grid-template-columns:minmax(0,1fr)}}.tools-panel{gap:1rem;min-width:0;display:grid}.tool-form{gap:.85rem;display:grid}.tools-field{border:0;gap:.4rem;min-width:0;margin:0;padding:0;display:grid}.tools-label{font-size:var(--fs-sm);color:var(--text);font-weight:600}.tools-field input[type=text],.tools-field input[type=url],.tools-field select{border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--bg-2);width:100%;min-height:44px;color:var(--text);font:inherit;padding:.6rem .8rem}.tools-field input:focus-visible,.tools-field select:focus-visible{outline:2px solid var(--p);outline-offset:1px}.tools-hint{color:var(--text-3);font-size:var(--fs-xs);margin:0}.tools-allergen-list{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.35rem .8rem;display:grid}.tools-check{font-size:var(--fs-sm);color:var(--text-2);align-items:center;gap:.45rem;display:flex}.tools-check input{width:18px;height:18px;accent-color:var(--p)}.tools-chips,.tools-swatches{flex-wrap:wrap;align-items:center;gap:.45rem;display:flex}.tools-chip{border:1px solid var(--line-strong);color:var(--text-2);font-size:var(--fs-sm);cursor:pointer;background:0 0;border-radius:999px;padding:.45rem .9rem}.tools-chip.is-active{background:var(--text);color:var(--bg);border-color:#0000;font-weight:600}.tools-swatch{border:2px solid var(--surface);width:34px;height:34px;box-shadow:0 0 0 1px var(--line-strong);cursor:pointer;border-radius:50%}.tools-swatch.is-active{box-shadow:0 0 0 3px var(--p)}.tools-preview{top:calc(var(--header-h) + 1rem);justify-items:center;gap:.8rem;margin:0;display:grid;position:sticky}.tools-preview img{aspect-ratio:5/7;border-radius:var(--radius-sm);width:100%;max-width:300px;box-shadow:var(--shadow);background:#fff}.tools-preview__empty{aspect-ratio:5/7;border:1px dashed var(--line-strong);border-radius:var(--radius-sm);width:100%;max-width:300px;color:var(--text-3);text-align:center;font-size:var(--fs-sm);place-items:center;margin:0;padding:1.5rem;display:grid}.tools-cta{padding-bottom:var(--section)}.tools-cta__box{text-align:center;background:radial-gradient(circle at 50% 0%, rgba(var(--p-rgb) / .18), transparent 70%), var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);justify-items:center;gap:1rem;padding:clamp(1.5rem,4vw,3rem);display:grid}.tools-cta__box h2{font-family:var(--font-display);font-size:var(--fs-h3);margin:0}.tools-cta__box p{max-width:60ch;color:var(--text-2);margin:0}.tools-cta .btn{white-space:normal;text-align:center;max-width:100%}
