@font-face{font-family:Instrument;src:url('../assets/instrument-sans.ttf') format('truetype');font-display:swap}
:root{font-family:Instrument,Arial,sans-serif;color:#242720;background:#f5f3eb;--paper:#f5f3eb;--ink:#242720;--muted:#707368;--line:#d4d6ca;--accent:#b4412c}
*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}a{color:inherit;text-decoration:none}button,a,input,label,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:5px}.sr-only,.skip-link:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.skip-link:focus{position:fixed;top:10px;left:10px;z-index:10;padding:15px;background:var(--ink);color:white}
.masthead{height:100px;margin:0 42px;border-bottom:1px solid var(--ink);display:flex;justify-content:space-between;align-items:center;gap:25px}.wordmark{font-size:33px;letter-spacing:-1.8px;font-weight:700}.wordmark>span:first-child{font-weight:400}.brand-dot{vertical-align:top;font-size:12px;letter-spacing:0;margin-left:5px}.edition,.eyebrow,.preview-heading,.colophon>span{font-size:10px;letter-spacing:1.2px;font-weight:600}.portfolio-link{font-size:13px}.portfolio-link span{margin-left:14px;font-size:20px}
.workbench{max-width:1600px;margin:auto;padding:38px 42px 42px;display:grid;grid-template-columns:320px minmax(0,1fr);grid-template-areas:'intro stage' 'message stage' 'settings stage';column-gap:66px;align-items:start;grid-template-rows:auto auto 1fr}.intro{grid-area:intro}.eyebrow{display:flex;align-items:center;gap:9px}.dot{width:7px;height:7px;background:var(--accent);border-radius:50%}h1{font-weight:500;font-size:44px;line-height:1.02;letter-spacing:-2px;margin:19px 0 16px}.intro p{color:var(--muted);font-size:14px;line-height:1.5;margin:0 0 28px}.message-panel{grid-area:message}.field-heading{display:flex;justify-content:space-between;font-size:12px;margin-bottom:10px}.field-heading label{font-weight:600}.field-heading>span{font-variant-numeric:tabular-nums;color:var(--muted);font-size:11px}textarea{display:block;resize:vertical;width:100%;min-height:114px;max-height:210px;background:transparent;border:1px solid #aaaE9e;border-radius:2px;color:var(--ink);font-size:25px;letter-spacing:-.5px;line-height:1.15;padding:13px 15px}textarea:focus{border-color:var(--ink)}.hint{font-size:10px;color:var(--muted);margin:8px 0 13px}.examples{display:flex;flex-wrap:wrap;align-items:center;gap:7px}.examples button{font-size:9px;letter-spacing:.4px;padding:7px 8px;border:1px solid var(--line);border-radius:3px;background:none}.examples button:hover{border-color:var(--ink)}.examples .clear{margin-left:auto;text-decoration:underline;border:0;font-size:10px;color:var(--muted)}.feedback{font-size:11px;line-height:1.45;min-height:16px;margin:9px 0 12px;color:var(--accent)}
.settings{grid-area:settings;display:grid;gap:19px}fieldset{border:0;margin:0;padding:0;min-width:0}legend{padding:0;margin-bottom:9px;font-size:12px;font-weight:600}.segmented{display:flex;border:1px solid var(--line);border-radius:3px;padding:3px;gap:3px}.segmented label{flex:1;position:relative;cursor:pointer}.segmented input,.swatches input{position:absolute;opacity:0;width:1px;height:1px}.segmented label>span{display:flex;gap:7px;align-items:center;justify-content:center;padding:10px 3px;font-size:11px;border-radius:2px;color:var(--muted)}.segmented input:checked+span{background:var(--ink);color:var(--paper)}.segmented input:focus-visible+span,.swatches input:focus-visible+span{outline:2px solid var(--accent);outline-offset:3px}.format-icon{display:block;border:1px solid currentColor;flex-shrink:0}.format-icon.square{width:12px;height:12px}.format-icon.story{width:8px;height:14px}.format-icon.landscape{width:15px;height:9px}.swatches{display:flex;gap:13px}.swatches label{position:relative;cursor:pointer}.swatches label>span{display:block;width:31px;height:31px;border-radius:50%;border:1px solid #a7a99e;background:var(--swatch)}.swatches input:checked+span{outline:1.5px solid var(--ink);outline-offset:3px}.checker{background-color:#fff!important;background-image:conic-gradient(#d9dad5 25%,transparent 0 50%,#d9dad5 0 75%,transparent 0)!important;background-size:12px 12px!important}.slider-field>label{display:flex;justify-content:space-between;font-size:12px;font-weight:600;margin-bottom:5px}.slider-field output{font-size:11px;font-weight:400;color:var(--muted)}input[type=range]{width:100%;height:20px;margin:0;accent-color:var(--ink);cursor:pointer}.signature-toggle{display:flex;gap:8px;align-items:center;font-size:11px;color:var(--muted);cursor:pointer}.signature-toggle input{accent-color:var(--ink);width:14px;height:14px;margin:0}
.composition{grid-area:stage;min-width:0;position:sticky;top:24px}.preview-heading{display:flex;justify-content:space-between;color:var(--muted);margin:0 0 14px}.stage{position:relative;background:#e4e5db;min-height:360px;height:min(66vw,660px);display:flex;justify-content:center;align-items:center;padding:25px;border:1px solid #dbddd1;overflow:hidden}.canvas-wrap{display:flex;align-items:center;justify-content:center;max-width:100%;max-height:100%;box-shadow:0 3px 18px #252c1512}.canvas-wrap.transparent{background:repeating-conic-gradient(#e6e7e1 0% 25%,white 0% 50%) 50%/18px 18px}canvas{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}#loading{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background:#e4e5db;font-size:13px}#loading[hidden]{display:none}.export-bar{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:20px 0;border-bottom:1px solid var(--line)}.export-title{display:block;font-size:17px;font-weight:500;letter-spacing:-.4px}.export-note{display:block;font-size:11px;color:var(--muted);margin-top:5px}.primary{display:flex;align-items:center;gap:30px;padding:16px 21px;background:var(--ink);border:1px solid var(--ink);color:var(--paper);font-size:13px;border-radius:3px;transition:background .15s}.primary:hover:enabled{background:var(--accent);border-color:var(--accent)}.primary span{font-size:20px;line-height:1}.secondary-actions{min-height:37px;display:flex;justify-content:space-between;gap:15px;align-items:flex-start;padding-top:13px;font-size:11px;color:var(--muted)}.secondary-actions button{border:0;padding:0;background:transparent;font-size:11px;text-align:left}.secondary-actions button:hover{color:var(--ink)}#export-status{font-size:11px;text-align:right;color:var(--accent)}
.colophon{margin:0 42px;border-top:1px solid var(--ink);padding:24px 0;display:flex;justify-content:space-between;gap:25px;align-items:start}.colophon p{margin:0;font-size:11px;line-height:1.5;color:var(--muted)}.colophon a{text-decoration:underline;text-underline-offset:3px}.series-number{color:var(--accent)}
@media(min-width:1500px){.stage{height:740px}.workbench{column-gap:100px;padding-top:48px}}@media(max-width:1100px){.workbench{column-gap:32px;grid-template-columns:285px minmax(0,1fr)}.masthead,.colophon{margin-left:26px;margin-right:26px}.workbench{padding-left:26px;padding-right:26px}.stage{height:570px;padding:16px}.edition{display:none}h1{font-size:40px}.primary{gap:16px;padding:15px}.export-title{font-size:15px}}
@media(max-width:760px){.masthead{height:77px;margin:0 20px}.wordmark{font-size:29px}.portfolio-link{font-size:11px}.portfolio-link span{margin-left:7px}.workbench{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:'intro' 'message' 'stage' 'settings';padding:27px 20px 32px;gap:0}.intro h1{font-size:39px;margin:15px 0 12px}.intro h1 br{display:none}.intro p{margin-bottom:24px;font-size:13px}.intro p br{display:none}.intro p br:after{content:' '}.eyebrow{font-size:9px}.message-panel textarea{min-height:91px;height:91px;font-size:24px}.feedback{margin-bottom:15px}.composition{position:static;margin:7px -8px 25px}.preview-heading{margin:0 8px 10px;font-size:9px}.stage{height:auto;min-height:0;padding:15px;aspect-ratio:1/1.08}.canvas-wrap{max-height:100%}.export-bar{padding:16px 8px}.export-title{font-size:15px}.primary{font-size:12px;gap:19px}.secondary-actions{padding:12px 8px 0}.settings{grid-template-columns:1fr 1fr;gap:21px 18px}.settings fieldset:nth-child(2){grid-column:1/-1;grid-row:2}.settings fieldset:nth-child(3){grid-column:2;grid-row:1}.swatches{gap:8px;padding-top:5px}.swatches label>span{width:25px;height:25px}.signature-toggle{grid-column:1/-1}.colophon{margin:0 20px;display:block;padding:22px 0}.colophon>span:first-child{display:block;margin-bottom:13px}.series-number{display:none}.colophon p{font-size:10px}.segmented label>span{font-size:10px}}
@media(max-width:360px){.settings{grid-template-columns:minmax(0,1fr)}.settings fieldset:nth-child(2),.settings fieldset:nth-child(3){grid-column:auto;grid-row:auto}.swatches{gap:15px}.export-title{font-size:13px}.primary{padding:14px 12px;gap:12px}.secondary-actions{flex-wrap:wrap}h1{font-size:36px}}
.family-picker{margin-bottom:25px}.family-picker .segmented input:checked+span{background:var(--accent);color:var(--paper)}#treatment-field[hidden]{display:none}.colophon p{max-width:560px}
.material-picker{margin:0 0 26px}.material-picker[hidden]{display:none}.material-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.material-options label{position:relative;cursor:pointer}.material-options input{position:absolute;opacity:0;width:1px;height:1px}.material-options span{display:flex;align-items:center;justify-content:center;gap:6px;padding:10px 3px;font-size:11px;border:1px solid var(--line);border-radius:3px}.material-options i{width:8px;height:8px;flex-shrink:0;border-radius:50%;background:var(--fruit)}.material-options input:checked+span{border-color:var(--ink);background:var(--ink);color:var(--paper)}.material-options input:focus-visible+span{outline:2px solid var(--accent);outline-offset:3px}
@media(max-width:760px){.settings:not([data-family="bottles"]) fieldset:nth-child(2){grid-column:1/-1;grid-row:1}.settings:not([data-family="bottles"]) fieldset:nth-child(3){grid-column:1/-1;grid-row:2}.family-picker{margin-bottom:24px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.family-picker .segmented span{display:flex;flex-direction:column;justify-content:center;min-height:60px;white-space:normal;line-height:1.3;text-wrap:balance}.family-picker small{display:block;font-size:9px;opacity:.7;margin-bottom:4px}.signature-toggle[hidden]{display:none}