:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--background:#f3f5f7;--background-accent:#e5eaf0;--surface:#f8fafc;--surface-raised:#fff;--surface-muted:#eef1f4;--input-surface:#fff;--text:#252b33;--text-muted:#667180;--border:#d8dee6;--border-strong:#bcc6d2;--accent:#526f91;--accent-strong:#3e5f83;--accent-soft:#e5ebf3;--focus:#376eaa;--danger:#a43d46;--danger-soft:#f9e9ea;--success:#315f98;--success-soft:#e7eff9;--shadow:0 16px 40px #27323f14;--shadow-hover:0 18px 44px #27323f24;--page-spacing:clamp(.75rem, 3vw, 1.75rem);--workspace-max-width:68rem;--workspace-shell-width:72rem;--section-gap:.5rem;--section-padding:.375rem;--card-padding:.6rem;--field-gap:.25rem;--button-height:2.75rem;--input-height-mobile:2.5rem;--input-height-desktop:2.375rem;--input-height:var(--input-height-mobile);--input-padding-block:.375rem;--textarea-padding-block:.375rem;--control-height:var(--button-height);--radius-card:.45rem;--radius-control:.375rem;--compact-card-padding:var(--card-padding);--compact-card-gap:.6rem;--compact-list-gap:.45rem;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--background:#101216;--background-accent:#171a20;--surface:#1b1f25;--surface-raised:#23272e;--surface-muted:#1d2127;--input-surface:#2a2f36;--text:#f1f3f5;--text-muted:#a7adb6;--border:#3a4048;--border-strong:#4b535e;--accent:#4c9cff;--accent-strong:#78b7ff;--accent-soft:#24354a;--focus:#70b3ff;--danger:#ff9aa2;--danger-soft:#482d33;--success:#8ab8ff;--success-soft:#24344a;--shadow:0 10px 26px #00000038;--shadow-hover:0 14px 32px #0000004d}}*,:before,:after{box-sizing:border-box}html{background:var(--background);min-width:320px;min-height:100%}body{min-width:320px;min-height:100svh;color:var(--text);background:radial-gradient(circle at 50% 0%, var(--background-accent), transparent 32rem), var(--background);margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--focus);outline-offset:3px}#root{min-height:100svh}.app-shell{width:min(100%, var(--workspace-shell-width));min-height:100svh;padding:max(.5rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) max(1rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));flex-direction:column;margin-inline:auto;display:flex}.brand-bar{justify-content:space-between;align-items:center;gap:.75rem;min-height:3rem;display:flex}.brand-mark img{border-radius:.35rem;width:1.55rem;height:1.55rem;display:block}.offline-banner{border:1px solid var(--danger);border-radius:var(--radius-control);background:var(--danger-soft);color:var(--text);margin:.5rem 0;padding:.55rem .75rem;font-weight:650}.pwa-notice{border:1px solid var(--border-strong);border-radius:var(--radius-control);background:var(--surface-raised);box-shadow:var(--shadow);flex-wrap:wrap;align-items:center;gap:.6rem;margin:.5rem 0;padding:.65rem .75rem;display:flex}.pwa-notice span{flex:16rem}.pwa-notice button,.install-help-button{border:1px solid var(--border-strong);border-radius:var(--radius-control);background:var(--surface-muted);min-height:2.25rem;color:var(--text);cursor:pointer}.pwa-notice button{padding:.35rem .7rem}.install-help-button{color:var(--text-muted);margin:0 0 .5rem auto;padding:.25rem .55rem;font-size:.78rem;display:block}.sign-in-branding{justify-items:start;gap:.3rem;margin-top:.75rem;display:grid}.sign-in-logo{border-radius:.9rem;width:clamp(3.5rem,14vw,4rem);height:clamp(3.5rem,14vw,4rem);margin-bottom:.35rem}.sign-in-branding h1{font-size:clamp(2rem,8vw,2.75rem);line-height:1.05}.sign-in-tagline,.home-tagline{color:var(--text-muted);font-weight:650;line-height:1.35}.sign-in-tagline{margin:0;font-size:clamp(.95rem,3vw,1.05rem)}.sign-in-action-intro{margin-top:clamp(1.25rem,5vw,1.75rem)}.sign-in-action-intro h2{margin:0;font-size:clamp(1.25rem,5vw,1.55rem);line-height:1.2}.account-actions{justify-content:flex-end;align-items:center;gap:.45rem;min-width:0;display:flex}.account-email{max-width:11rem;color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;font-size:.72rem;overflow:hidden}.sign-out-button{border:1px solid var(--border);border-radius:var(--radius-control);min-height:2.25rem;color:var(--text);background:var(--surface);cursor:pointer;padding:.35rem .55rem;font-size:.75rem;font-weight:750}.shell-auth-error,.auth-error{border-radius:var(--radius-control);color:var(--danger);background:var(--danger-soft);margin:.5rem 0 0;padding:.5rem .65rem;font-size:.82rem}.auth-loading{min-height:100vh;color:var(--text-muted);place-items:center;display:grid}.sign-in-page{place-items:center;width:min(100% - 2rem,26rem);min-height:100svh;margin-inline:auto;display:grid}.sign-in-card{border:1px solid var(--border);border-radius:var(--radius-card);background:var(--surface-raised);width:100%;box-shadow:var(--shadow);padding:clamp(1rem,5vw,1.5rem)}.product-footer{padding:.85rem 0 max(.25rem, env(safe-area-inset-bottom));color:var(--text-muted);text-align:center;flex-wrap:wrap;justify-content:center;gap:.25rem .75rem;font-size:.72rem;line-height:1.4;display:flex}.sign-in-card .product-footer{border-top:1px solid var(--border);margin-top:1.1rem}.sign-in-summary{color:var(--text-muted);margin:.35rem 0 1rem;line-height:1.45}.sign-in-form{gap:.75rem;display:grid}.auth-submit{cursor:pointer;border:0;width:100%}.auth-submit:disabled{cursor:wait;opacity:.7}.brand-link{min-height:var(--control-height);border-radius:var(--radius-control);color:var(--text);letter-spacing:-.01em;align-items:center;gap:.55rem;font-size:.9rem;font-weight:700;text-decoration:none;display:inline-flex}.brand-mark,.action-icon,.placeholder-icon,.method-icon,.scan-icon{color:var(--accent-strong);background:var(--accent-soft);flex:none;justify-content:center;align-items:center;display:inline-flex}.brand-mark{border-radius:var(--radius-control);width:2.25rem;height:2.25rem}.app-content{padding-block:var(--page-spacing);flex:1 0 auto}.page{width:min(100%, var(--workspace-max-width));margin-inline:auto}.home-intro{margin-bottom:1rem}.home-intro h1{font-size:clamp(2.25rem,6vw,3.6rem)}.home-tagline{color:var(--accent-strong);margin:.3rem 0 0;font-size:clamp(1rem,2.5vw,1.2rem)}.home-summary{margin-top:clamp(.85rem,2.5vw,1.15rem)}.is-disabled{cursor:not-allowed;opacity:.55}.eyebrow{color:var(--accent-strong);letter-spacing:.13em;text-transform:uppercase;margin:0 0 .4rem;font-size:.78rem;font-weight:800}h1{color:var(--text);letter-spacing:-.045em;margin:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(2.25rem,10vw,4.35rem);font-weight:600;line-height:1.02}.home-summary{max-width:34rem;color:var(--text-muted);margin:.65rem 0 0;font-size:1rem;line-height:1.5}.page-intro{justify-content:space-between;align-items:flex-start;gap:.55rem;margin:0 0 .75rem;display:flex}.page-intro p,.persistence-note,.method-list-item p{color:var(--text-muted);margin:0;font-size:.95rem;line-height:1.5}.workflow-page .page-intro{margin-bottom:.85rem}.workflow-section+.workflow-section{margin-top:1.25rem}.section-heading{flex-direction:column;justify-content:space-between;align-items:flex-start;gap:.4rem;margin-bottom:.45rem;display:flex}.section-heading h2,.method-list-item h2,.placeholder-card h2{color:var(--text);letter-spacing:-.02em;margin:0;font-size:1.05rem;font-weight:750;line-height:1.35}.secondary-link{min-height:var(--control-height);border-radius:var(--radius-control);color:var(--accent-strong);align-items:center;gap:.45rem;padding:.35rem .55rem;font-size:.85rem;font-weight:750;text-decoration:none;display:inline-flex}.method-grid,.method-list,.master-list-links{gap:var(--compact-list-gap);display:grid}.method-card{min-height:4.75rem;padding:var(--compact-card-padding);border:1px solid var(--border);border-radius:var(--radius-card);align-items:center;gap:var(--compact-card-gap);color:var(--text);background:var(--surface-raised);box-shadow:var(--shadow);grid-template-columns:auto minmax(0,1fr) auto;text-decoration:none;transition:border-color .16s,box-shadow .16s,transform .16s;display:grid}.method-icon,.scan-icon{border-radius:var(--radius-control);width:2.5rem;height:2.5rem}.method-copy,.scan-copy{gap:.15rem;min-width:0;display:grid}.method-copy strong,.scan-copy strong{font-size:1rem;line-height:1.3}.method-copy small,.scan-copy small{color:var(--text-muted);font-size:.85rem;line-height:1.35}.method-arrow{color:var(--accent);transition:transform .16s}.scan-card{min-height:4.75rem;padding:var(--compact-card-padding);border:1px dashed var(--border-strong);border-radius:var(--radius-card);align-items:center;gap:var(--compact-card-gap);color:var(--text-muted);background:var(--surface-muted);cursor:not-allowed;opacity:.78;grid-template-columns:auto minmax(0,1fr);display:grid}.scan-icon{color:var(--text-muted);background:var(--surface)}.card-title-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.45rem;display:flex}.status-label.compact-status{flex:none;margin-top:0}.master-list-intro{flex-direction:column;margin-bottom:.7rem}.disabled-action{min-height:var(--control-height);border:1px solid var(--border);border-radius:var(--radius-control);color:var(--text-muted);background:var(--surface-muted);cursor:not-allowed;align-items:center;gap:.5rem;padding:.4rem .6rem;font-size:.875rem;font-weight:750;display:inline-flex}.button-status{background:var(--surface);letter-spacing:.04em;text-transform:uppercase;border-radius:999px;padding:.2rem .4rem;font-size:.65rem}.persistence-note{border-left:3px solid var(--accent);border-radius:0 var(--radius-control) var(--radius-control) 0;background:var(--accent-soft);margin-bottom:.65rem;padding:.5rem .65rem}.method-list-item{padding:var(--compact-card-padding);border:1px solid var(--border);border-radius:var(--radius-card);align-items:start;gap:var(--compact-card-gap);background:var(--surface-raised);box-shadow:var(--shadow);grid-template-columns:auto minmax(0,1fr);display:grid}.method-list-copy{min-width:0;padding-top:.05rem}.method-list-item p{margin-top:.15rem;font-size:.875rem;line-height:1.4}.active-status{border:1px solid var(--border);color:var(--accent-strong);background:var(--accent-soft);letter-spacing:.05em;text-transform:uppercase;border-radius:999px;padding:.2rem .45rem;font-size:.68rem;font-weight:800;display:inline-flex}.master-list-link-title{align-items:center;gap:.45rem;display:flex}.master-list-link-title>span{border:1px solid var(--border);min-width:1.6rem;color:var(--text-muted);background:var(--surface-muted);border-radius:999px;justify-content:center;align-items:center;padding:.1rem .35rem;font-size:.68rem;font-weight:750;display:inline-flex}.master-list-intro-copy{gap:.15rem;display:grid}.master-list-intro-copy>strong{color:var(--text);font-size:.8rem;line-height:1.3}.master-data-list{border:1px solid var(--border);border-radius:var(--radius-card);background:var(--surface-raised);overflow:hidden}.master-data-header,.master-data-row{padding:.45rem .55rem}.master-data-header{color:var(--text-muted);background:var(--surface-muted);letter-spacing:.04em;text-transform:uppercase;font-size:.68rem;font-weight:800;display:none}.master-data-row{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.35rem .6rem;min-width:0;display:grid}.master-data-row+.master-data-row{border-top:1px solid var(--border)}.master-data-row>strong{min-width:0;font-size:.86rem;line-height:1.3}.master-data-meta{min-width:0;color:var(--text-muted);align-items:baseline;gap:.3rem;font-size:.76rem;display:flex}.master-data-meta>span{letter-spacing:.03em;text-transform:uppercase;font-size:.64rem;font-weight:800}.master-data-description{color:var(--text-muted);grid-column:1/-1;font-size:.76rem;line-height:1.35}.master-status{border:1px solid var(--border);width:max-content;color:var(--text-muted);background:var(--surface-muted);letter-spacing:.04em;text-transform:uppercase;border-radius:999px;padding:.18rem .4rem;font-size:.65rem;font-weight:800;display:inline-flex}.master-status--active{color:var(--accent-strong);background:var(--accent-soft)}.row-edit-button{border:1px solid var(--border);border-radius:var(--radius-control);min-height:2.25rem;color:var(--text-muted);background:var(--surface-muted);font:inherit;cursor:not-allowed;opacity:.68;justify-content:center;align-items:center;padding:.3rem .55rem;font-size:.75rem;font-weight:750;display:inline-flex}.master-list-toolbar{gap:.4rem;margin-bottom:.45rem;display:grid}.master-toolbar-clear,.master-list-clear-button{width:max-content}.master-result-count{color:var(--text-muted);margin:0 0 .35rem;font-size:.78rem;font-weight:700}.master-list-empty-state{border:1px dashed var(--border-strong);border-radius:var(--radius-card);min-height:7rem;color:var(--text-muted);background:var(--surface-muted);text-align:center;align-content:center;place-items:center;gap:.55rem;padding:.85rem;display:grid}.master-list-empty-state p{margin:0;font-size:.88rem;line-height:1.4}.master-list-empty-state .master-list-empty-detail{max-width:32rem;font-size:.78rem}.brand-data-grid .master-status,.brand-data-grid .row-edit-button,.dye-data-grid .master-status,.dye-data-grid .row-edit-button,.formula-status-data-grid .master-status,.formula-status-data-grid .row-edit-button,.colour-family-data-grid .master-status,.colour-family-data-grid .row-edit-button{justify-self:end}.brand-data-grid .master-data-meta,.dye-data-grid .master-data-meta,.formula-status-data-grid .master-data-meta,.colour-family-data-grid .master-data-meta{grid-column:1}.action-grid{gap:var(--compact-list-gap);display:grid}.action-card{align-items:center;gap:var(--compact-card-gap);min-height:4.5rem;padding:var(--compact-card-padding);border:1px solid var(--border);border-radius:var(--radius-card);color:var(--text);background:var(--surface-raised);box-shadow:var(--shadow);grid-template-columns:auto minmax(0,1fr) auto;text-decoration:none;transition:border-color .16s,box-shadow .16s,transform .16s;display:grid}.action-icon{border-radius:var(--radius-control);width:2.5rem;height:2.5rem}.action-copy{gap:.1rem;min-width:0;display:grid}.action-copy strong{font-size:1.05rem;line-height:1.25}.action-copy small{color:var(--text-muted);font-size:.875rem;line-height:1.4}.action-arrow{color:var(--accent);transition:transform .16s}.page-header{grid-template-columns:minmax(4.5rem,auto) minmax(0,1fr) 2.75rem;align-items:center;gap:.45rem;margin-bottom:.5rem;display:grid}.page-header h1{letter-spacing:-.025em;text-align:center;text-overflow:ellipsis;white-space:nowrap;font-family:inherit;font-size:clamp(1.1rem,5vw,1.35rem);font-weight:750;line-height:1.25;overflow:hidden}.header-action{min-width:var(--control-height);min-height:var(--control-height);border:1px solid var(--border);border-radius:var(--radius-control);color:var(--text);background:var(--surface);cursor:pointer;justify-content:center;align-items:center;gap:.4rem;padding:.5rem;font-size:.875rem;font-weight:700;text-decoration:none;transition:border-color .16s,background .16s;display:inline-flex}.header-action--back{justify-self:start}.header-action--home{justify-self:end}.placeholder-card{border:1px solid var(--border);border-radius:calc(var(--radius-card) + .1rem);text-align:center;background:linear-gradient(var(--surface), var(--surface)) padding-box, repeating-linear-gradient(0deg, transparent 0 1.8rem, var(--border) 1.8rem 1.85rem) border-box;min-height:11rem;box-shadow:var(--shadow);flex-direction:column;justify-content:center;align-items:center;padding:clamp(1rem,4vw,1.75rem) 1rem;display:flex}.placeholder-icon{border-radius:var(--radius-card);width:3rem;height:3rem;margin-bottom:.6rem}.placeholder-card p{max-width:29rem;color:var(--text-muted);margin:0;font-size:1rem;line-height:1.5}.placeholder-card .eyebrow{margin-bottom:.25rem}.placeholder-card h2+p{margin-top:.4rem}.status-label{border:1px solid var(--border);color:var(--text-muted);background:var(--surface-muted);letter-spacing:.04em;text-transform:uppercase;border-radius:999px;margin-top:.6rem;padding:.35rem .6rem;font-size:.75rem;font-weight:750;display:inline-flex}.primary-link{min-height:var(--control-height);border-radius:var(--radius-control);color:var(--surface);background:var(--accent-strong);justify-content:center;align-items:center;gap:.5rem;margin-top:1rem;padding:.55rem .8rem;font-size:.9rem;font-weight:750;text-decoration:none;display:inline-flex}body:has(.formula-editor-page) .app-content{padding-block:clamp(.5rem,2vw,1.25rem)}.formula-editor-page .page-header{margin-bottom:.4rem}.editor-intro{min-height:var(--control-height);border:1px solid var(--border);border-radius:var(--radius-control);background:var(--surface-muted);justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:.3rem;padding:.35rem .55rem;display:flex}.editor-intro h2{overflow-wrap:anywhere;margin:0;font-size:1rem;line-height:1.35}.method-badge{border:1px solid var(--border);color:var(--accent-strong);background:var(--accent-soft);letter-spacing:.04em;text-transform:uppercase;border-radius:999px;flex:none;padding:.3rem .55rem;font-size:.7rem;font-weight:800}.formula-editor,.formula-view-content{gap:var(--section-gap);display:grid}.browse-filters,.browse-results{border:1px solid var(--border);border-radius:var(--radius-card);background:var(--surface-raised);box-shadow:var(--shadow);margin-bottom:.75rem;padding:.75rem}.browse-filter-heading,.browse-results-heading,.browse-pagination{justify-content:space-between;align-items:center;gap:.75rem;display:flex}.browse-filter-heading{margin-bottom:.6rem}.browse-filter-toggle,.browse-filter-clear-mobile{display:none}.browse-filter-summary{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:.78rem;overflow:hidden}.browse-filter-heading h2,.browse-results-heading h2{margin:0;font-size:1rem}.browse-filter-grid{gap:.5rem;display:grid}.browse-filter-grid label{gap:.2rem;font-size:.78rem;font-weight:750;display:grid}.browse-results-heading{margin-bottom:.5rem}.browse-results-heading span,.browse-pagination span{color:var(--text-muted);font-size:.8rem;font-weight:700}.browse-message{text-align:center;color:var(--text-muted);margin:0;padding:1.5rem .75rem}.browse-message h3{color:var(--text);margin:0 0 .3rem}.browse-message p{margin:0}.browse-message--error{color:var(--danger)}.formula-list{border:1px solid var(--border);border-radius:var(--radius-control);overflow:hidden}.formula-list-header,.formula-summary-link{grid-template-columns:5.3rem minmax(9rem,1.7fr) minmax(6rem,.8fr) minmax(6rem,.85fr) minmax(7rem,1fr) 5.3rem 6.6rem;align-items:center;column-gap:.65rem;display:grid}.formula-list-header{border-bottom:1px solid var(--border-strong);min-height:1.9rem;color:var(--text-muted);background:var(--surface-muted);letter-spacing:.03em;text-transform:uppercase;padding:.3rem .55rem;font-size:.7rem;font-weight:800}.formula-summary-list{margin:0;padding:0;list-style:none}.formula-summary-list li+li{border-top:1px solid var(--border)}.formula-summary-list li:nth-child(2n){background:var(--surface-muted)}.formula-summary-link{min-height:2.55rem;color:inherit;padding:.38rem .55rem;text-decoration:none;transition:background .14s}.formula-summary-code{color:var(--accent-strong);font-size:.8rem}.formula-summary-name{white-space:nowrap;text-overflow:ellipsis;min-width:0;margin:0;font-size:.88rem;overflow:hidden}.formula-summary-method,.formula-summary-brand,.formula-summary-colours,.formula-summary-updated{white-space:nowrap;text-overflow:ellipsis;min-width:0;font-size:.78rem;overflow:hidden}.formula-summary-colours,.formula-summary-updated{color:var(--text-muted)}.formula-summary-status.status-label{justify-self:start;margin:0;padding:.22rem .42rem;font-size:.65rem}.browse-pagination{justify-content:center;margin-top:.75rem}.search-panel{border:1px solid var(--border);border-radius:var(--radius-card);background:var(--surface-raised);box-shadow:var(--shadow);margin-bottom:.75rem;padding:.75rem}.search-panel h2{margin:0 0 .65rem;font-size:1rem}.search-form,.search-form label{gap:.3rem;display:grid}.search-form label{font-size:.78rem;font-weight:750}.search-input-row{grid-template-columns:minmax(0,1fr) auto;gap:.45rem;display:grid}.formula-list--search .formula-list-header,.formula-list--search .formula-summary-link{grid-template-columns:5.3rem minmax(8rem,1.5fr) minmax(5.5rem,.7fr) minmax(5.5rem,.7fr) minmax(6rem,.8fr) 5rem 6.2rem minmax(6rem,.8fr)}.formula-summary-match{min-width:0;color:var(--accent-strong);white-space:nowrap;text-overflow:ellipsis;font-size:.72rem;font-weight:700;overflow:hidden}.formula-summary-link:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.formula-view-header strong{color:var(--text-muted);letter-spacing:.06em;font-size:.85rem}.formula-view-content h2{color:var(--accent-strong);margin:0 0 .6rem;font-size:1rem}.formula-view-recipe h3{margin:0 0 .35rem;font-size:.85rem}.formula-view-solution+.formula-view-solution{border-top:1px solid var(--border);margin-top:.8rem;padding-top:.8rem}.formula-view-recipe ol{gap:.35rem;margin:0;padding-left:1.6rem;display:grid}.formula-view-recipe li{padding-left:.15rem}.formula-view-recipe li>span{justify-content:space-between;gap:.5rem;width:min(28rem,100% - 6rem);display:inline-flex}.formula-view-water{color:var(--text-muted);margin:.4rem 0 0;padding-left:1.6rem;font-size:.78rem;line-height:1.35}.formula-view-water strong{color:inherit}.formula-view-notes-body{margin:0;padding-left:2.5rem}.formula-view-recipe small,.formula-view-dates span{color:var(--text-muted)}.formula-view-details{border-top:1px solid var(--border);grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin:0;display:grid}.formula-view-details>div{border-bottom:1px solid var(--border);grid-template-columns:minmax(7rem,.7fr) 1fr;gap:.6rem;padding:.45rem 0;display:grid}.formula-view-details>div:nth-child(odd){padding-right:1rem}.formula-view-details dt{color:var(--text-muted);font-size:.75rem;font-weight:700}.formula-view-details dd{margin:0;font-weight:600}.formula-view-footer{justify-content:space-between;align-items:center;gap:1rem;display:flex}.formula-view-dates p{margin:.15rem 0;font-size:.78rem}.formula-images{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;display:grid}.formula-images>h2,.formula-images>.form-message,.formula-images>[role=status],.formula-images>.field-help{grid-column:1/-1}.formula-image-group{gap:.5rem;display:grid}.formula-image-group h3{margin:0;font-size:.9rem}.formula-image-empty{color:var(--text-muted);margin:0}.wool-image-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;display:grid}.formula-image{gap:.4rem;min-width:0;display:grid}.formula-image--primary{border:2px solid var(--accent);border-radius:var(--radius-control);padding:.4rem}.formula-image-preview{background:var(--surface-muted);cursor:zoom-in;border:0;width:100%;padding:0;display:block}.formula-image-preview img{aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius-control);width:100%;max-height:10rem;display:block}.formula-image-actions{flex-wrap:wrap;gap:.35rem;display:flex}.image-primary-label{color:var(--accent-strong);background:var(--accent-soft);border-radius:999px;margin-left:.4rem;padding:.15rem .4rem;font-size:.68rem}.formula-image-broken{border:1px dashed var(--danger);padding:1rem}@media (width<=640px){.browse-filters{padding:0;overflow:hidden}.browse-filter-title{display:none}.browse-filter-toggle{background:0 0;border:0;border-radius:0;justify-content:space-between;width:100%;min-height:2.65rem;padding:.5rem .65rem;display:flex}.browse-filter-toggle svg{transition:transform .16s}.browse-filter-toggle[aria-expanded=true] svg{transform:rotate(180deg)}.browse-filter-heading{gap:0;margin:0}.browse-filter-clear{display:none}.browse-filter-clear-mobile{display:inline-flex}.browse-filter-summary{padding:0 .65rem .5rem}.browse-filter-grid{border-top:1px solid var(--border);margin:0;padding:.6rem .65rem .65rem}.formula-list-header{display:none}.formula-list{border-inline:0;border-radius:0}.formula-summary-link{grid-template-columns:5rem minmax(0,1fr) auto;grid-template-areas:"code name status""method brand colours";gap:.18rem .45rem;min-height:3.25rem;padding:.4rem .2rem}.formula-summary-code{grid-area:code}.formula-summary-name{grid-area:name}.formula-summary-method{grid-area:method}.formula-summary-brand{grid-area:brand}.formula-summary-colours{text-align:right;grid-area:colours}.formula-summary-status{grid-area:status}.formula-summary-updated{display:none}.formula-list--search .formula-summary-link{grid-template-columns:5rem minmax(0,1fr) auto;grid-template-areas:"code name status""method match colours"}.formula-list--search .formula-summary-brand{display:none}.formula-summary-match{grid-area:match}.formula-view-details{grid-template-columns:1fr}.formula-view-details>div:nth-child(odd){padding-right:0}.formula-view-details>div{grid-template-columns:minmax(6.5rem,.7fr) 1fr}.formula-view-footer{flex-direction:column;align-items:stretch}.formula-view-footer .primary-button{justify-content:center}.formula-images,.wool-image-grid{grid-template-columns:1fr}.formula-image-actions .secondary-button{flex:1}}.editor-section{padding:var(--section-padding);border:1px solid var(--border);border-radius:var(--radius-card);background:var(--surface-raised);box-shadow:0 2px 8px #27323f0f}.editor-section-heading{justify-content:space-between;align-items:baseline;gap:.75rem;margin-bottom:.2rem;display:flex}.editor-section-heading>div{align-items:baseline;gap:.45rem;display:flex}.editor-section-heading h2{color:var(--accent-strong);letter-spacing:-.015em;margin:0;font-size:1rem;font-weight:800;line-height:1.3}.editor-section-heading>p,.field-help,.field-error{margin:0;font-size:.75rem;line-height:1.35}.editor-section-heading>p,.field-help{color:var(--text-muted)}.section-kicker{color:var(--accent-strong);letter-spacing:.08em;margin:0;font-size:.68rem;font-weight:800}.field-grid,.formula-core-grid,.classification-grid{gap:var(--field-gap);display:grid}.formula-core-grid{margin-bottom:.2rem}.form-field{align-content:start;gap:.1rem;min-width:0;display:grid}.form-field label,.form-field legend{color:var(--text);font-size:.78rem;font-weight:750;line-height:1.35}.optional-label{color:var(--text-muted);font-size:.68rem;font-weight:600}input,select,textarea{border:1px solid var(--border-strong);border-radius:var(--radius-control);width:100%;color:var(--text);background:var(--input-surface);font:inherit;font-size:.875rem;transition:border-color .16s,background .16s}input,select{height:var(--input-height);min-height:var(--input-height);padding:var(--input-padding-block) .55rem;line-height:1.2}.formula-editor input:not([type=checkbox]),.formula-editor select{height:38px;min-height:38px;padding-block:5px}textarea{min-height:3.375rem;padding:var(--textarea-padding-block) .55rem;resize:vertical;line-height:1.3}input::placeholder,textarea::placeholder{color:var(--text-muted);opacity:.78}input[readonly]{color:var(--text-muted);background:var(--surface-muted);border-style:dashed}input[aria-invalid=true],select[aria-invalid=true],textarea[aria-invalid=true]{border-color:var(--danger)}.field-error{color:var(--danger);font-weight:700}.colour-family-fieldset{border:0;margin:0;padding:0}.colour-family-fieldset legend{margin-bottom:.2rem;padding:0}.chip-options{flex-wrap:wrap;gap:.25rem;display:flex}.selectable-chip{cursor:pointer;display:inline-flex;position:relative}.selectable-chip input{clip:rect(0, 0, 0, 0);white-space:nowrap;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.selectable-chip span{border:1px solid var(--border);min-height:2rem;color:var(--text-muted);background:var(--surface);border-radius:999px;align-items:center;padding:.3rem .5rem;font-size:.75rem;font-weight:700;display:inline-flex}.selectable-chip input:checked+span{border-color:var(--accent);color:var(--accent-strong);background:var(--accent-soft)}.selectable-chip input:focus-visible+span{outline:3px solid var(--focus);outline-offset:2px}.solution-panel{border:0;border-top:1px solid var(--border);background:0 0;border-radius:0;padding:.15rem 0 0}.solution-heading{justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:.1rem;display:flex}.solution-heading h3,.image-placeholder h3{margin:0;font-size:.875rem;line-height:1.35}.solution-heading h3{color:var(--text);font-weight:800}.solution-heading span{color:var(--text-muted);font-size:.7rem;font-weight:700}.spot-solution-list{gap:.2rem;display:grid}.spot-solution{border-top-color:var(--border-strong)}.spot-solution-heading{min-height:var(--control-height);align-items:center}.solution-title{flex-wrap:wrap;align-items:baseline;gap:.3rem;min-width:0;display:flex}.solution-remove-button{flex:none}.solution-structure-error{margin:0 0 .2rem}.dye-list,.instruction-list{gap:2px;display:grid}.dye-list-header,.dye-row{grid-template-columns:1.25rem minmax(0, 1.2fr) minmax(4.5rem, .8fr) var(--control-height);column-gap:5px;display:grid}.dye-list-header{color:var(--text-muted);align-items:end;font-size:.7rem;font-weight:750;line-height:1.2}.dye-column-header{grid-column:2}.amount-column-header{grid-column:3}.dye-row{background:0 0;border:0;border-radius:0;row-gap:2px;padding:0;position:relative}.row-number{min-height:38px;color:var(--text-muted);place-content:center;align-self:start;font-size:.72rem;font-weight:750;line-height:1;display:grid}.icon-button,.secondary-button,.primary-button{min-height:var(--control-height);border-radius:var(--radius-control);cursor:pointer;justify-content:center;align-items:center;gap:.45rem;font-size:.8rem;font-weight:750;display:inline-flex}.icon-button{width:var(--control-height);border:1px solid var(--border);color:var(--text-muted);background:var(--input-surface);padding:.55rem}.icon-button:disabled,.image-placeholder button:disabled{cursor:not-allowed;opacity:.5}.remove-row-button{grid-column:4;place-self:start end;margin-top:0}.secondary-button,.primary-button{border:1px solid var(--border-strong);padding:.6rem .85rem}.secondary-button{color:var(--text);background:var(--input-surface)}.primary-button{border-color:var(--accent-strong);color:var(--surface);background:var(--accent-strong)}.add-row-button{margin-top:.15rem}.spot-solution-controls{grid-template-columns:minmax(0,1fr);align-items:start;gap:0;margin-top:2px;padding-top:0;display:grid}.solution-action-row{flex-wrap:wrap;align-items:center;gap:4px;margin-top:6px;display:flex}.solution-action-button{flex:none}.water-amount-field{min-width:0}.instruction-row{grid-template-columns:2.75rem minmax(0,1fr) auto;align-items:start;gap:.25rem;display:grid}.step-number{min-height:38px;color:var(--text-muted);background:0 0;border:0;border-radius:0;align-content:center;justify-items:center;display:grid}.instruction-row textarea{height:38px;min-height:38px;padding-block:5px}.notes-section textarea{height:54px;min-height:54px;padding-block:5px}.step-number span{letter-spacing:.04em;text-transform:uppercase;font-size:.62rem;font-weight:750}.step-number strong{color:var(--text);font-size:1rem}.remove-step-button{grid-column:3;place-self:center end}.image-placeholder-grid{gap:.3rem;display:grid}.image-placeholder{border:1px dashed var(--border-strong);border-radius:var(--radius-control);color:var(--text-muted);background:0 0;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.5rem;padding:.4rem .45rem;display:grid}.image-placeholder>svg{color:var(--accent-strong)}.image-placeholder p{color:var(--text-muted);margin:.15rem 0 0;font-size:.72rem;line-height:1.4}.image-placeholder button{min-height:var(--control-height);border:1px solid var(--border);border-radius:var(--radius-control);color:var(--text-muted);background:var(--input-surface);font:inherit;grid-column:3;padding:.4rem .6rem;font-size:.72rem;font-weight:750}.action-section{padding:var(--section-padding);border-color:var(--border)}.form-message{border-radius:var(--radius-control);border:1px solid;align-items:flex-start;gap:.55rem;margin-bottom:.25rem;padding:.35rem .45rem;font-size:.8rem;font-weight:650;line-height:1.45;display:flex}.form-message svg{flex:none}.form-message--error{border-color:var(--danger);color:var(--danger);background:var(--danger-soft)}.form-message--success{border-color:var(--success);color:var(--success);background:var(--success-soft)}.form-actions{gap:.3rem;display:grid}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (hover:hover){.formula-summary-link:hover{background:var(--accent-soft)}.action-card:hover{border-color:var(--border-strong);box-shadow:var(--shadow-hover);transform:translateY(-2px)}.action-card:hover .action-arrow{transform:translate(3px)}.method-card:hover{border-color:var(--border-strong);box-shadow:var(--shadow-hover);transform:translateY(-2px)}.method-card:hover .method-arrow{transform:translate(3px)}.secondary-link:hover{background:var(--accent-soft)}.header-action:hover{border-color:var(--border-strong);background:var(--surface-raised)}.secondary-button:hover:not(:disabled),.icon-button:hover:not(:disabled){border-color:var(--accent);background:var(--accent-soft)}.primary-button:hover{filter:brightness(1.08)}}@media (width>=42rem){:root{--section-padding:.4rem;--field-gap:5px;--input-height:var(--input-height-desktop);--input-padding-block:.3rem;--textarea-padding-block:.3rem}.formula-editor input:not([type=checkbox]),.formula-editor select{height:30px;min-height:30px;padding:2px 10px;font-size:13px;line-height:1.15}.formula-editor .form-field{gap:0}.formula-editor .form-field>label,.formula-editor .form-field>legend{margin-bottom:2px}.formula-editor .form-field>.field-help,.formula-editor .form-field>.field-error{margin-top:2px}.step-number,.instruction-row textarea{height:30px;min-height:30px}.instruction-row textarea{padding-block:4px;font-size:13px}.notes-section textarea{height:46px;min-height:46px;padding-block:5px;font-size:13px}.secondary-button.add-row-button{height:34px;min-height:34px;padding-block:4px}.dye-list,.instruction-list,.instruction-row,.spot-solution-controls{gap:5px}.dye-list{gap:3px}.dye-list-header,.dye-row{column-gap:5px}.dye-row{row-gap:2px}.row-number{min-height:30px}.add-row-button{margin-top:2px}.app-shell{padding-inline:max(2rem, env(safe-area-inset-right)) max(2rem, env(safe-area-inset-left))}.home-intro{margin-bottom:.9rem}.home-intro h1{white-space:nowrap}.action-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem}.browse-filter-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.action-card{min-height:5rem}.section-heading,.master-list-intro{flex-direction:row;align-items:center}.method-grid,.master-list-links{grid-template-columns:repeat(2,minmax(0,1fr))}.method-card{min-height:5.25rem}.master-list-link{min-height:4.25rem}.master-list-toolbar{grid-template-columns:minmax(14rem,1fr) 10rem 10rem auto;align-items:end}.master-toolbar-clear{min-height:var(--input-height-desktop)}.master-data-header,.master-data-row{align-items:center;column-gap:.65rem;display:grid}.brand-data-grid{grid-template-columns:minmax(8rem,1.4fr) .7fr .8fr .75fr .75fr auto}.dye-data-grid{grid-template-columns:minmax(9rem,1.6fr) .65fr .6fr .7fr .75fr auto}.formula-status-data-grid{grid-template-columns:minmax(7rem,.8fr) .55fr minmax(14rem,1.8fr) .7fr auto}.colour-family-data-grid{grid-template-columns:minmax(9rem,1.3fr) .65fr .65fr .7fr auto}.master-data-meta{color:var(--text-muted);display:block}.master-data-meta>span{display:none}.brand-data-grid .master-data-meta,.dye-data-grid .master-data-meta,.formula-status-data-grid .master-data-meta,.colour-family-data-grid .master-data-meta,.master-data-description{grid-column:auto}.brand-data-grid .master-status,.brand-data-grid .row-edit-button,.dye-data-grid .master-status,.dye-data-grid .row-edit-button,.formula-status-data-grid .master-status,.formula-status-data-grid .row-edit-button,.colour-family-data-grid .master-status,.colour-family-data-grid .row-edit-button{justify-self:start}.formula-editor{gap:var(--section-gap)}.editor-section{padding:var(--section-padding)}.editor-section-heading{gap:.75rem}.field-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.field-span-2{grid-column:1/-1}.formula-core-grid{grid-template-columns:1fr 1.35fr .65fr}.formula-name-field{grid-column:1/-1}.classification-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.classification-status-field{max-width:15rem}.classification-colours-field{grid-column:1/-1}.dye-list-header,.dye-row{grid-template-columns:1.25rem minmax(0,1.15fr) minmax(5rem,.85fr) 34px}.dye-row{align-items:start}.spot-solution-controls{grid-template-columns:minmax(10rem,16rem);justify-content:start}.spot-solution-heading{min-height:34px}.solution-action-row .secondary-button,.dye-row .remove-row-button,.solution-remove-button{width:auto;height:34px;min-height:34px}.dye-row .remove-row-button,.solution-remove-button{width:34px;padding:5px}.remove-row-button{grid-column:4;align-self:start;margin-top:0}.instruction-row{grid-template-columns:3rem minmax(0,1fr) auto}.remove-step-button{grid-column:3;margin-top:0}.image-placeholder-grid,.form-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.image-placeholder button{min-height:var(--control-height);grid-column:3;justify-self:start}.form-actions{display:flex}.form-actions .primary-button{order:2}.form-actions .secondary-button{order:1}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}.confirmation-backdrop{z-index:100;background:#1419168c;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.confirmation-dialog{background:var(--surface,white);border-radius:.75rem;width:min(32rem,100%);padding:1.5rem;box-shadow:0 1rem 3rem #00000040}.confirmation-actions{justify-content:flex-end;gap:.75rem;margin-top:1.25rem;display:flex}
