/* Product & Label Studio, the four steps (studio-shell.js). The visual language of the site (style.css,
   design-v2.css): cream ground, white panels with a thin rule and a 12 px radius, navy ink, blue for selection
   and focus only, buttons with a 3 px radius, Ubuntu headings and Poppins text. No rule of 2 px or more except focus. */
#ss{--ss-ink:#102c36;--ss-muted:#4b6067;--ss-cream:#f4f4ed;--ss-paper:#fcfcf8;--ss-white:#fff;--ss-rule:#d5ddd9;--ss-rule-strong:#9fb6bc;
  --ss-accent:#0879a9;--ss-accent-soft:#e4eff1;--ss-ok:#1d6b3a;--ss-ok-soft:#e5f2e8;--ss-warn:#7a4b00;--ss-warn-soft:#fbf1dc;--ss-err:#a3261b;--ss-err-soft:#fbe9e7;
  --ss-h:"Ubuntu","Trebuchet MS","Segoe UI",Arial,sans-serif;--ss-b:"Poppins","Helvetica Neue",Helvetica,Arial,sans-serif;--ss-top:calc(var(--ld-navh,76px) + 12px);
  position:relative;color:var(--ss-ink);font-family:var(--ss-b);font-size:16px;line-height:1.6;text-align:left}
#ss *,#ss *::before,#ss *::after{box-sizing:border-box}
#ss[hidden]{display:none!important}
#tool{scroll-margin-top:var(--ld-navh,76px)}
#ss{scroll-margin-top:calc(var(--ld-navh,76px) + 8px)}

/* the steps replace the earlier views; the previous studio shows them again */
.ld-tool.ss-on:not(.ss-previous)>:not(.ss):not(.ss-skip){display:none!important}
.ld-tool.ss-previous>.ss,.ld-tool.ss-previous>.ss-skip{display:none!important}
.ld-tool:not(.ss-on)>.ss,.ld-tool:not(.ss-on)>.ss-skip{display:none}
.ss-skip{position:absolute;left:16px;top:8px;z-index:40;padding:12px 16px;min-height:44px;background:#102c36;color:#fff;border-radius:3px;font-weight:600;text-decoration:none;clip-path:inset(50%);width:1px;height:1px;overflow:hidden;white-space:nowrap}
.ss-skip:focus{clip-path:none;width:auto;height:auto;outline:3px solid #0879a9;outline-offset:2px}

#ss :where(h1,h2,h3,h4):where(:not(.ss-editor *)){font-family:var(--ss-h);font-weight:700;line-height:1.15;letter-spacing:-.02em;margin:0 0 8px;color:var(--ss-ink);text-transform:none}
#ss :where(h1):where(:not(.ss-editor *)){font-size:clamp(26px,3.2vw,34px)}
#ss :where(h2):where(:not(.ss-editor *)){font-size:22px}
#ss .ss-h3{font-size:18px}
#ss h1:focus{outline:none}
#ss :where(p):where(:not(.ss-editor *)){margin:0 0 12px}
#ss :where(a):where(:not(.ss-editor *)){color:var(--ss-ink);text-underline-offset:3px}
#ss :where(button,input,select,textarea):where(:not(.ss-editor *)){font:inherit;color:inherit;letter-spacing:normal;text-transform:none}
#ss :focus-visible{outline:3px solid var(--ss-accent);outline-offset:2px}
#ss svg.ss-ico{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#ss .ss-vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
#ss .ss-file{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
#ss .ss-eyebrow{font-size:12px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--ss-muted);margin:0 0 6px}
#ss .ss-hint{color:var(--ss-muted);font-size:14px;margin:4px 0 0}
#ss .ss-lead{color:var(--ss-muted);max-width:62ch}
#ss .ss-label{font-weight:600;font-size:15px;margin:0}
#ss .ss-m0{margin:0}
#ss .ss-mt{margin-top:14px}
#ss .ss-note{background:var(--ss-accent-soft);border:1px solid #b8d3dc;border-radius:10px;padding:10px 14px;font-size:15px;margin:14px 0 0}

/* top bar */
#ss .ss-top{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;padding:10px 0 12px}
#ss .ss-top__name{font-family:var(--ss-h);font-weight:700;font-size:16px;margin:0 auto 0 0}
#ss .ss-top__save{margin:0;font-size:14px;color:var(--ss-muted)}
#ss .ss-top__save.is-error{color:var(--ss-err);font-weight:600}
#ss .ss-top__tools{display:flex;gap:6px;align-items:center}
#ss .ss-tbtn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;min-width:44px;padding:0 12px;background:var(--ss-white);border:1px solid var(--ss-rule-strong);border-radius:3px;cursor:pointer;font-size:14px;font-weight:500;color:var(--ss-ink);list-style:none;line-height:1.2}
#ss .ss-tbtn::-webkit-details-marker{display:none}
#ss .ss-tbtn svg{width:18px;height:18px}
#ss .ss-tbtn:disabled{color:#56696e;background:#eff2ef;cursor:not-allowed}
#ss .ss-tbtn:hover:not(:disabled){background:var(--ss-accent-soft)}
#ss .ss-tbtn[aria-pressed=true]{background:var(--ss-accent-soft);border-color:var(--ss-accent);box-shadow:inset 0 0 0 1px var(--ss-accent)}
#ss .ss-menu{position:relative}
#ss .ss-menu__list{position:absolute;right:0;top:calc(100% + 6px);background:var(--ss-white);border:1px solid var(--ss-rule);border-radius:10px;box-shadow:0 12px 32px rgba(16,44,54,.14);padding:6px;display:grid;min-width:300px;z-index:30}
#ss .ss-menu__list button,#ss .ss-menu__file{position:relative;display:flex;align-items:center;min-height:44px;padding:0 12px;background:none;border:0;border-radius:6px;text-align:left;cursor:pointer;font-size:15px;color:var(--ss-ink);font-weight:400}
#ss .ss-menu__list button:hover,#ss .ss-menu__file:hover{background:var(--ss-accent-soft)}
#ss .ss-menu__file:focus-within{outline:3px solid var(--ss-accent)}

/* steps */
#ss .ss-steps{background:var(--ss-paper);border:1px solid var(--ss-rule);border-radius:12px;padding:0 12px;margin:0 0 16px}
#ss .ss-steps[hidden]{display:none}
#ss .ss-steps ol{display:flex;gap:4px;list-style:none;margin:0;padding:0}
#ss .ss-steps li{flex:1;margin:0;padding:0}
#ss .ss-steps li::before{content:none}
#ss .ss-steps a{display:flex;align-items:center;gap:10px;min-height:56px;padding:6px 8px;text-decoration:none;color:var(--ss-muted);font-weight:500}
#ss .ss-steps a[aria-current=step]{color:var(--ss-ink);box-shadow:inset 0 -3px 0 var(--ss-ink)}
#ss .ss-steps a:hover{color:var(--ss-ink)}
#ss .ss-n{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;border:1px solid var(--ss-rule-strong);font-size:13px;font-weight:600;background:var(--ss-white);flex:none;color:var(--ss-ink)}
#ss .ss-steps a[aria-current=step] .ss-n{background:var(--ss-ink);color:#fff;border-color:var(--ss-ink)}
#ss .ss-steps .is-done .ss-n{background:var(--ss-ok-soft);color:var(--ss-ok);border-color:#9cc7a9}
#ss .ss-t{display:block;line-height:1.25}
#ss .ss-st{display:block;font-size:12px;font-weight:400;color:var(--ss-muted)}

/* layout */
#ss .ss-studio{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;align-items:start}
@media(min-width:1000px){#ss .ss-studio{grid-template-columns:minmax(0,1fr) 380px}#ss[data-view=start] .ss-studio,#ss[data-view=sent] .ss-studio{grid-template-columns:minmax(0,1fr)}#ss[data-view=start] .ss-pv--side,#ss[data-view=sent] .ss-pv--side{display:none}}
#ss .ss-panel{background:var(--ss-white);border:1px solid var(--ss-rule);border-radius:12px;padding:28px;min-width:0}
#ss .ss-panel:focus{outline:none}
@media(max-width:600px){#ss .ss-panel{padding:20px 16px}}
#ss .ss-section{border-top:1px solid var(--ss-rule);padding-top:20px;margin-top:24px}
#ss .ss-q{margin:22px 0 0;padding:0;border:0;min-width:0}
#ss .ss-q--first{margin-top:0}
#ss .ss-q>legend,#ss .ss-q__title{font-family:var(--ss-h);font-weight:700;font-size:17px;margin:0 0 4px;padding:0;color:var(--ss-ink)}
#ss .ss-q>legend.ss-vh{position:absolute}

/* buttons */
#ss .ss-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:12px 22px;border-radius:3px;border:1px solid var(--ss-ink);background:var(--ss-ink);color:#fff;font-weight:600;font-size:15px;cursor:pointer;text-decoration:none;line-height:1.2;box-shadow:none;transform:none}
#ss .ss-btn:hover{background:#126a8c;border-color:#126a8c;color:#fff}
#ss .ss-btn--ghost{background:var(--ss-white);color:var(--ss-ink)}
#ss .ss-btn--ghost:hover{background:var(--ss-accent-soft);color:var(--ss-ink);border-color:var(--ss-ink)}
#ss .ss-btn--quiet{background:transparent;color:var(--ss-ink);border-color:transparent;text-decoration:underline;text-underline-offset:3px;padding:12px 10px;min-height:44px}
#ss .ss-btn--quiet:hover{background:var(--ss-accent-soft);border-color:transparent;color:var(--ss-ink)}
#ss .ss-btn--sm{min-height:44px;padding:8px 16px;font-size:14px}
#ss .ss-btn svg{width:18px;height:18px}
#ss .ss-link{display:inline-flex;align-items:center;min-height:44px;min-width:44px;vertical-align:middle;background:none;border:0;padding:0 2px;margin:0;color:var(--ss-ink);text-decoration:underline;text-underline-offset:3px;font-weight:600;cursor:pointer;font-size:inherit}
#ss .ss-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}

/* fields */
#ss .ss-field{display:grid;gap:4px;margin-top:16px}
#ss .ss-field--narrow{max-width:280px}
#ss .ss-field--inline{grid-template-columns:1fr auto;align-items:end}
@media(max-width:520px){#ss .ss-field--inline{grid-template-columns:1fr}}
#ss .ss-field small{color:var(--ss-muted);font-size:13px}
#ss :where(.ss-field) :where(input[type=text],input[type=email],input[type=url],input[type=tel],input[type=number],input[type=search],select,textarea){width:100%;min-height:48px;padding:10px 12px;background:var(--ss-white);border:1px solid #7f969c;border-radius:6px;color:var(--ss-ink);box-shadow:none;margin:0}
#ss :where(.ss-field) :where(textarea){min-height:88px;resize:vertical}
#ss input::placeholder,#ss textarea::placeholder{color:#5a6d72;opacity:1}
#ss :where(input[type=color]):where(:not(.ss-editor *)){width:48px;height:48px;padding:4px;border:1px solid #7f969c;border-radius:6px;background:#fff;cursor:pointer}
#ss .ss-err{color:var(--ss-err);font-size:14px;margin:6px 0 0;font-weight:500}
#ss .ss-err:empty{display:none}
#ss :where([aria-invalid=true]):where(:not(.ss-editor *)){border-color:var(--ss-err)!important;background:var(--ss-err-soft)}
#ss .ss-grid2{display:grid;gap:0 16px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
#ss .ss-colour{display:inline-flex;align-items:center;gap:8px;min-height:48px}

/* option cards, chips */
#ss .ss-opts{display:grid;gap:10px;margin-top:10px}
#ss .ss-opts--2{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
#ss .ss-opt{position:relative;display:flex;gap:12px;align-items:flex-start;min-height:56px;padding:14px 16px;background:var(--ss-white);border:1px solid var(--ss-rule-strong);border-radius:10px;cursor:pointer;margin:0;font-weight:400}
#ss .ss-opt:hover{background:#f7faf9}
#ss .ss-opt.is-on{background:var(--ss-accent-soft);border-color:var(--ss-accent);box-shadow:inset 0 0 0 1px var(--ss-accent)}
#ss .ss-opt:focus-within{outline:3px solid var(--ss-accent);outline-offset:2px}
#ss .ss-opt input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
#ss .ss-opt input:disabled{cursor:not-allowed}
#ss .ss-opt__mark{flex:none;width:20px;height:20px;margin-top:2px;border-radius:50%;border:1px solid #5e7378;background:#fff;display:grid;place-items:center}
#ss .ss-opt--check .ss-opt__mark{border-radius:4px}
#ss .ss-opt.is-on .ss-opt__mark{border-color:var(--ss-accent);background:var(--ss-accent)}
#ss .ss-opt.is-on .ss-opt__mark::after{content:"";width:8px;height:8px;border-radius:50%;background:#fff}
#ss .ss-opt--check.is-on .ss-opt__mark::after{content:"\2713";width:auto;height:auto;border-radius:0;background:none;color:#fff;font-size:14px;font-weight:700;line-height:1}
#ss .ss-opt__body{display:grid;gap:2px;min-width:0}
#ss .ss-opt__title{font-weight:600}
#ss .ss-opt__meta{font-size:14px;color:var(--ss-muted)}
#ss .ss-badge{display:inline-block;font-size:12px;font-weight:600;padding:1px 8px;border-radius:999px;background:var(--ss-accent-soft);color:var(--ss-ink);margin-left:6px;vertical-align:1px;line-height:1.6}
#ss .ss-badge--ok{background:var(--ss-ok-soft);color:var(--ss-ok)}
#ss .ss-badge--req{background:#eceee7;color:#38464a}
#ss .ss-badge--opt{background:#fff;color:#38464a;border:1px solid var(--ss-rule)}
#ss .ss-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
#ss .ss-chip{position:relative;display:inline-flex;align-items:center;gap:6px;min-height:44px;min-width:44px;padding:8px 14px;border:1px solid var(--ss-rule-strong);border-radius:999px;background:var(--ss-white);cursor:pointer;font-weight:500;font-size:15px;margin:0;color:var(--ss-ink)}
#ss .ss-chip input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer;width:100%;height:100%}
#ss .ss-chip.is-on{background:var(--ss-accent-soft);border-color:var(--ss-accent);box-shadow:inset 0 0 0 1px var(--ss-accent)}
#ss .ss-chip:focus-within{outline:3px solid var(--ss-accent);outline-offset:2px}
#ss .ss-chip small{color:var(--ss-muted);font-weight:400;font-size:13px}
/* one-click suggestions in the brand step (studio-shell.js refineHTML): a value the visitor applies with a click, then edits */
#ss .ss-sugrow{margin-top:8px;gap:8px 12px}
#ss .ss-sugrow .ss-hint{flex:1 1 220px}
#ss .ss-btn[aria-disabled=true]{opacity:.65;cursor:default}
#ss .ss-btn--ghost[aria-disabled=true]:hover{background:var(--ss-white);border-color:var(--ss-ink)}
#ss .ss-sugs{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 6px}
#ss .ss-sugs__lead{flex:1 0 100%}
#ss .ss-sug{display:inline-flex;align-items:center;min-height:44px;max-width:100%;padding:8px 14px;border:1px solid var(--ss-rule-strong);border-radius:10px;background:var(--ss-white);color:var(--ss-ink);font-size:15px;font-weight:500;line-height:1.35;text-align:left;cursor:pointer;margin:0}
#ss .ss-sug:hover{background:#f7faf9;border-color:var(--ss-ink)}
#ss .ss-sug.is-on{background:var(--ss-accent-soft);border-color:var(--ss-accent);box-shadow:inset 0 0 0 1px var(--ss-accent)}
#ss .ss-sw{width:18px;height:18px;border-radius:50%;border:1px solid rgba(0,0,0,.25);display:inline-block}

/* start */
#ss .ss-routes{display:grid;gap:12px;margin-top:20px}
@media(min-width:760px){#ss .ss-routes{grid-template-columns:repeat(3,1fr)}}
#ss .ss-route{display:grid;gap:8px;align-content:start;text-align:left;padding:20px;min-height:180px;background:var(--ss-white);border:1px solid var(--ss-rule-strong);border-radius:12px;cursor:pointer;color:var(--ss-ink)}
#ss .ss-route:hover{border-color:var(--ss-ink);background:#fbfcfb}
#ss .ss-route svg{width:36px;height:36px;color:var(--ss-accent)}
#ss .ss-route strong{font-family:var(--ss-h);font-size:19px}
#ss .ss-route span{color:var(--ss-muted);font-size:14px}
#ss .ss-route em{font-style:normal;font-size:13px;font-weight:600;color:var(--ss-ink);margin-top:auto}
#ss .ss-also{margin-top:24px;padding-top:16px;border-top:1px solid var(--ss-rule)}
#ss .ss-upload__btn{position:relative;overflow:hidden}
#ss .ss-upload__btn:focus-within{outline:3px solid var(--ss-accent);outline-offset:2px}
#ss .ss-resume{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin:18px 0 0;padding:14px 16px;border:1px solid #b8d3dc;border-radius:10px;background:var(--ss-accent-soft)}
#ss .ss-resume p{margin:0}
#ss .ss-kept{margin-top:20px;padding:14px 16px;border:1px solid var(--ss-rule);border-radius:10px;background:var(--ss-paper)}
#ss .ss-kept p{margin:0 0 8px;font-size:15px}
#ss .ss-kept ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
#ss .ss-kept li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin:0}
#ss .ss-kept li::before{content:none}
#ss .ss-kept small{color:var(--ss-muted)}

/* result card */
#ss .ss-result{margin-top:18px;padding:16px 18px;border-radius:10px;background:var(--ss-paper);border:1px solid var(--ss-rule)}
#ss .ss-result--ok{background:var(--ss-ok-soft);border-color:#b7d6c0}
#ss .ss-result--bad{background:var(--ss-err-soft);border-color:#e8b9b3}
#ss .ss-result--info{background:var(--ss-accent-soft);border-color:#b8d3dc}
#ss .ss-result__big{font-family:var(--ss-h);font-size:20px;font-weight:700;margin:0 0 4px}
#ss .ss-result p:last-child{margin-bottom:0}
#ss .ss-result ul{margin:8px 0 0;padding-left:20px}
#ss details.ss-more{margin-top:14px;border-top:1px solid var(--ss-rule)}
#ss details.ss-more>summary{display:flex;align-items:center;gap:8px;min-height:48px;cursor:pointer;font-weight:600;list-style:none;color:var(--ss-ink)}
#ss details.ss-more>summary::-webkit-details-marker{display:none}
#ss details.ss-more>summary::before{content:"\203A";font-size:22px;line-height:1;width:12px;text-align:center;transition:transform .15s}
#ss details.ss-more[open]>summary::before{transform:rotate(90deg)}
#ss details.ss-more>summary small{font-weight:400;color:var(--ss-muted);margin-left:auto;text-align:right;font-size:14px}
#ss .ss-more__body{padding:0 0 12px}
@media(prefers-reduced-motion:reduce){#ss details.ss-more>summary::before{transition:none}}
#ss table.ss-t{width:100%;border-collapse:collapse;font-size:14px;margin-top:8px}
#ss table.ss-t thead,#ss table.ss-t tbody,#ss table.ss-t tr{background:transparent}
#ss table.ss-t th,#ss table.ss-t td{background:transparent;color:var(--ss-ink);text-align:left;padding:8px 6px;border-bottom:1px solid var(--ss-rule);font-weight:400}
#ss table.ss-t thead th{font-weight:600;color:var(--ss-muted);font-size:13px}
#ss table.ss-t tbody th{font-weight:600}
#ss .ss-empty{padding:18px;border:1px dashed var(--ss-rule-strong);border-radius:10px;color:var(--ss-muted);margin-top:12px}
#ss .ss-checks{list-style:none;padding:0;margin:10px 0 0;display:grid;gap:8px}
#ss .ss-checks li{display:flex;gap:10px;align-items:flex-start;font-size:15px;margin:0}
#ss .ss-checks li::before{content:none}
#ss .ss-dot{flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:700;margin-top:1px}
#ss .ss-dot--todo{background:var(--ss-warn-soft);color:var(--ss-warn)}
#ss .ss-dot--ok{background:var(--ss-ok-soft);color:var(--ss-ok)}
#ss .ss-dot--info{background:var(--ss-accent-soft);color:var(--ss-ink)}
#ss a.ss-link{display:inline;min-height:0;min-width:0;padding:0;vertical-align:baseline}
#ss .ss-upload{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:14px;border:1px dashed var(--ss-rule-strong);border-radius:10px;margin-top:10px;background:var(--ss-paper)}
#ss .ss-upload .ss-err{flex-basis:100%}
#ss .ss-thumb{width:72px;height:48px;object-fit:contain;border-radius:4px;border:1px solid var(--ss-rule);background:#fff}
/* artwork uploads (6 Nov 2026): a long file name wraps inside the box and never widens the page; one file per slot with its
   page, its notes and the size of the enquiry */
#ss .ss-upload>*{min-width:0}
#ss .ss-upload.has-file{border-style:solid;border-color:var(--ss-rule)}
#ss .ss-upload__name{flex:1 1 12em;min-width:0;overflow-wrap:anywhere}
#ss .ss-fname{overflow-wrap:anywhere;word-break:break-word}
#ss .ss-upload__notes{flex-basis:100%;display:grid;gap:8px}
#ss .ss-upload__notes .ss-hint{font-size:14px}
#ss .ss-thumb--none{display:inline-grid;place-items:center;font-size:12px;font-weight:700;color:var(--ss-muted);flex:none}
#ss .ss-page{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;font-size:14px}
#ss .ss-page__pick{display:inline-flex;align-items:center;gap:8px}
#ss .ss-page__pick label{font-weight:500;margin:0}
#ss .ss-page__pick input{width:5.5em;min-height:44px}
#ss .ss-shape{padding:10px 12px;border-radius:8px;background:var(--ss-warn-soft);color:var(--ss-ink);font-size:14px;overflow-wrap:anywhere}
#ss .ss-size{margin:12px 0 0}
#ss .ss-size--over{padding:12px 14px;border:1px solid #d9b46a;border-radius:10px;background:var(--ss-warn-soft);color:var(--ss-ink);font-size:15px}
#ss .ss-size--over:focus{outline:3px solid var(--ss-accent);outline-offset:2px}
#ss .ss-size--over .ss-btn{display:inline-block;white-space:normal;text-align:left;max-width:100%;overflow-wrap:anywhere;line-height:1.35}
#ss .ss-size--over .ss-row{gap:8px}
#ss .ss-others{margin-top:12px;padding:12px 14px;border:1px solid var(--ss-rule);border-radius:10px;background:var(--ss-paper)}
#ss .ss-others ul{list-style:none;margin:6px 0;padding:0;display:grid;gap:6px}
#ss .ss-others li{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0}
#ss .ss-others li::before{content:none}
#ss .ss-artcheck{margin:16px 0 0;padding:10px;border:1px solid var(--ss-rule);border-radius:10px;background:#fff}
#ss .ss-artcheck canvas{display:block;width:100%;height:auto;border:1px solid var(--ss-rule)}
#ss .ss-artcheck figcaption{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;margin-top:8px;font-size:14px;color:var(--ss-muted)}
#ss .ss-artcheck .ss-btn{color:var(--ss-ink)}
#ss .ss-checks li>span{min-width:0;overflow-wrap:anywhere}
#ss .lo__dl dd,#ss .lo__dlrow dd{min-width:0;overflow-wrap:anywhere}

/* formula builder in the step (studio-recipe-ui.js, layout step) */
#ss .ss-recipe{margin-top:8px}

/* design gallery */
#ss .ss-designs{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-top:12px}
#ss .ss-dcard{position:relative;display:grid;gap:6px;align-content:start;padding:10px;border:1px solid var(--ss-rule-strong);border-radius:10px;background:#fff;cursor:pointer;margin:0;font-weight:400}
#ss .ss-dcard input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer;width:100%;height:100%;z-index:2}
#ss .ss-dcard.is-on{border-color:var(--ss-accent);box-shadow:inset 0 0 0 1px var(--ss-accent);background:var(--ss-accent-soft)}
#ss .ss-dcard:focus-within{outline:3px solid var(--ss-accent);outline-offset:2px}
#ss .ss-dcard__art{display:block;aspect-ratio:3/4;border-radius:4px;overflow:hidden;border:1px solid rgba(16,44,54,.15)}
#ss .ss-dcard__art svg{display:block;width:100%;height:100%;stroke:none}
#ss .ss-dcard__name{font-weight:600;font-size:14px;line-height:1.3}
#ss .ss-dcard__mood{font-size:13px;color:var(--ss-muted);line-height:1.35}
#ss .ss-skel{background:linear-gradient(90deg,#eef1ec 25%,#f7f8f5 37%,#eef1ec 63%);background-size:400% 100%;animation:ss-sk 1.2s ease infinite;border-radius:10px;min-height:190px}
@keyframes ss-sk{0%{background-position:100% 50%}100%{background-position:0 50%}}
@media(prefers-reduced-motion:reduce){#ss .ss-skel{animation:none}}

/* Create my designs and the wait (28 Oct 2026): one main button, skeleton cards with the time, a wait bar at the foot */
#ss #ss-h-design{scroll-margin-top:calc(var(--ss-top) + 8px)}
#ss .ss-make{display:grid;gap:8px;justify-items:start;margin:4px 0 16px;padding:14px 16px;background:var(--ss-accent-soft);border:1px solid #b8d3dc;border-radius:12px}
#ss .ss-btn--make{min-width:220px;background:var(--ss-accent);border-color:var(--ss-accent);font-size:16px}
#ss .ss-btn--make:hover:not(:disabled){background:#06668f}
#ss .ss-btn--make:disabled{opacity:1;cursor:progress;background:#4f8fab;border-color:#4f8fab}
#ss .ss-check{display:flex;gap:8px;align-items:flex-start;font-size:14px;color:var(--ss-muted);line-height:1.45}
#ss .ss-check input{margin-top:3px;width:18px;height:18px;flex:none}
#ss .ss-spin{display:inline-block;flex:none;width:18px;height:18px;border-radius:50%;border:2.5px solid currentColor;border-right-color:transparent;animation:ss-spin .8s linear infinite}
@keyframes ss-spin{to{transform:rotate(360deg)}}
#ss .ss-wait{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:14px}
#ss .ss-wait[hidden]{display:none}
#ss .ss-wait .ss-spin{color:var(--ss-accent)}
#ss .ss-wait__text{display:flex;flex-wrap:wrap;gap:2px 10px;align-items:baseline;flex:1 1 220px}
#ss .ss-wait__text strong{font-weight:600;color:var(--ss-ink)}
#ss .ss-wait__text span{color:var(--ss-muted);font-variant-numeric:tabular-nums}
#ss .ss-wait progress{flex:1 1 160px;height:8px;border:0;border-radius:4px;overflow:hidden;background:#dfe7e4;accent-color:var(--ss-accent);-webkit-appearance:none;appearance:none}
#ss .ss-wait progress::-webkit-progress-bar{background:#dfe7e4;border-radius:4px}
#ss .ss-wait progress::-webkit-progress-value{background:var(--ss-accent);border-radius:4px;transition:width .9s linear}
#ss .ss-wait progress::-moz-progress-bar{background:var(--ss-accent)}
#ss .ss-wait .ss-link{min-height:44px}
#ss .ss-wait--box{padding:12px 14px;margin-bottom:12px;background:var(--ss-white);border:1px solid var(--ss-rule);border-radius:10px}
#ss .ss-wait--bar{padding:4px 2px 10px;margin-bottom:8px;border-bottom:1px solid var(--ss-rule)}
#ss .ss-skel--card{display:grid;align-content:start;gap:8px;min-height:0;padding:8px;background:var(--ss-white);border:1px solid var(--ss-rule);animation:none}
#ss .ss-skel__art,#ss .ss-skel__line{display:block;border-radius:4px;background:linear-gradient(90deg,#eef1ec 25%,#f7f8f5 37%,#eef1ec 63%);background-size:400% 100%;animation:ss-sk 1.4s ease infinite}
#ss .ss-skel__art{aspect-ratio:3/4}
#ss .ss-skel__line{height:12px;width:70%}
#ss .ss-skel__line--short{width:45%}
#ss .ss-outcome{margin:0 0 14px}
#ss .ss-thumb{background:repeating-conic-gradient(#e9eeec 0 25%,#fff 0 50%) 0 0/12px 12px}
@media(prefers-reduced-motion:reduce){#ss .ss-spin{animation:none;border-right-color:currentColor;opacity:.6}#ss .ss-skel__art,#ss .ss-skel__line{animation:none}#ss .ss-wait progress::-webkit-progress-value{transition:none}}

/* preview */
#ss .ss-pv--side{display:none}
@media(min-width:1000px){#ss .ss-pv--side{display:block;position:sticky;top:var(--ss-top);max-height:calc(100vh - var(--ss-top) - 96px);overflow:auto;background:var(--ss-white);border:1px solid var(--ss-rule);border-radius:12px;padding:18px}}
#ss .ss-pv__head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}
#ss .ss-pv__chip{font-size:12px;font-weight:600;background:#eceee7;color:#38464a;border-radius:999px;padding:2px 10px}
#ss .ss-pv__stage{position:relative;background:#dce3df;border-radius:10px;overflow:hidden}
#ss .ss-pv__stage .ld-3d{max-width:none;width:100%;margin:0}
#ss .ss-pv__stage .ld-3d__canvas{max-width:none;width:100%;aspect-ratio:1/1;height:auto}
#ss .ss-pv--side .ss-pv__stage .ld-3d__canvas{max-height:calc(100vh - var(--ss-top) - 330px);min-height:220px}
#ss .ss-pv__flat{padding:10px;background:#fff}
#ss .ss-pv__flat canvas{display:block;width:100%;height:auto;border:1px solid var(--ss-rule)}
#ss .ss-pv__zones{display:grid;grid-template-columns:1fr 1fr 1fr;text-align:center;font-size:12px;color:var(--ss-muted);margin:6px 0 0}
#ss .ss-pv__facts{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:4px;font-size:14px}
#ss .ss-pv__facts li{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid var(--ss-rule);padding:6px 0;margin:0}
#ss .ss-pv__facts li::before{content:none}
#ss .ss-pv__facts span:first-child{color:var(--ss-muted)}
#ss .ss-pv__facts span:last-child{text-align:right}
#ss .ss-pv__note{font-size:13px;color:var(--ss-muted);margin:10px 0 0}
#ss .ss-seg{display:flex;gap:4px;padding:4px;background:#eef1ec;border-radius:8px;margin:10px 0}
#ss .ss-seg label{position:relative;flex:1;display:grid;place-items:center;min-height:44px;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;margin:0;color:var(--ss-ink)}
#ss .ss-seg input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer;width:100%;height:100%}
#ss .ss-seg label.is-on{background:#fff;box-shadow:0 1px 3px rgba(16,44,54,.18)}
#ss .ss-seg label:focus-within{outline:3px solid var(--ss-accent)}
#ss .ss-views{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:8px}
#ss .ss-views[hidden]{display:none}

/* action bar: sticky at the foot of the Studio, so the next step is always in view */
#ss .ss-bar{position:sticky;bottom:0;z-index:25;margin-top:16px;background:rgba(252,252,248,.97);border:1px solid var(--ss-rule);border-radius:12px;padding:10px 12px;box-shadow:0 -6px 18px rgba(16,44,54,.06)}
#ss .ss-bar[hidden]{display:none}
#ss .ss-bar__inner{display:flex;gap:10px;align-items:center;width:100%}
#ss .ss-bar__status{margin-right:auto;font-size:14px;color:var(--ss-muted)}
#ss .ss-btn--primary{min-width:200px}
#ss .ss-pv-open{display:inline-flex}
@media(min-width:1000px){#ss .ss-pv-open{display:none!important}}
@media(max-width:600px){#ss .ss-bar__status{display:none}#ss .ss-btn--primary{min-width:0;flex:1}#ss .ss-bar{border-radius:0;margin-left:-16px;margin-right:-16px}}

/* dialogs */
#ss .ss-sheet{border:0;padding:0;width:calc(100% - 32px);max-width:520px;max-height:calc(100vh - 32px);border-radius:14px;background:var(--ss-white);color:var(--ss-ink)}
#ss .ss-sheet::backdrop{background:rgba(16,44,54,.45)}
#ss .ss-sheet--editor{max-width:1480px;width:calc(100% - 32px);height:calc(100vh - 32px)}
@media(max-width:600px){#ss .ss-sheet{max-width:100vw;width:100%;height:100%;max-height:100%;margin:0;border-radius:0}}
#ss .ss-sheet .ss-pv,#ss .ss-sheet__head{min-width:0}
#ss .ss-sheet__head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--ss-rule);position:sticky;top:0;background:#fff;z-index:5}
#ss .ss-sheet__title{font-size:18px;margin:0}
#ss .ss-sheet__head .ss-hint{margin:2px 0 0}
#ss .ss-pv--sheet{padding:16px}
#ss .ss-pv--sheet .ss-pv__head .ss-eyebrow{display:none}
#ss .ss-editor{padding:12px 16px 24px}
#ss .ss-editor .lw__brand,#ss .ss-editor .lw__handoff{display:none}

/* messages */
#ss .ss-toast[hidden]{display:none}
#ss .ss-toast{position:fixed;left:50%;bottom:96px;transform:translateX(-50%);background:var(--ss-ink);color:#fff;padding:8px 8px 8px 16px;border-radius:8px;display:flex;gap:8px;align-items:center;z-index:60;max-width:calc(100vw - 32px);font-size:15px;box-shadow:0 10px 30px rgba(16,44,54,.25)}
#ss .ss-toast .ss-btn--light{color:#fff}
#ss .ss-toast .ss-btn--light:hover{background:#1f4552;color:#fff}
#ss .ss-tbtn--light{background:transparent;color:#fff;border-color:transparent}
#ss .ss-tbtn--light:hover:not(:disabled){background:#1f4552}

@media(max-width:999px){#ss .ss-top__name{display:none}#ss .ss-steps a{flex-direction:column;gap:2px;min-height:60px;justify-content:center;text-align:center;font-size:13px}#ss .ss-st{display:none}#ss .ss-n{width:26px;height:26px}}
@media(max-width:420px){#ss .ss-top__tools .ss-tbtn span{display:none}#ss .ss-pv-open span{display:inline!important}#ss .ss-steps{padding:0 4px}}

/* the full editor in its dialog: the editor keeps its own look (label-workspace.css); here only what the steps need:
   44 px targets, readable small labels, and no second dark button or the old next step */
#ss .ss-editor :is(button,select,input:not([type=checkbox]):not([type=radio])){min-height:44px}
#ss .ss-editor button{min-width:44px}
#ss .ss-editor input[type=color]{min-width:44px}
#ss .ss-editor .lw__guide{min-height:44px;display:inline-flex;align-items:center}
#ss .ss-editor .lw__primary,#ss .ss-editor [data-action=review]{background:#fff;color:#102c36;border:1px solid #102c36}
#ss .ss-editor .lw__primary:hover,#ss .ss-editor [data-action=review]:hover{background:#e4eff1;color:#102c36}
#ss .ss-editor [data-action=preview]{display:none}
#ss .ss-editor .lw__field small,#ss .ss-editor .lw__ruler span{color:#3f5257}
#ss .ss-sheet__head .ss-tbtn{white-space:nowrap}
@media(max-width:600px){#ss .ss-sheet--editor .ss-sheet__head .ss-hint{display:none}}

/* What is inside: the label-style facts panel of the chosen ready formula (TSLabelReady.factsHTML) */
#ss .sf{margin:4px 0 0;display:grid;gap:8px;min-width:0;text-align:left}
#ss .sf__title{margin:0;font-weight:600;font-size:15px;line-height:1.4;color:#102c36}
#ss .sf__label{background:#fff;border:1px solid #102c36;border-radius:4px;padding:12px 14px 10px;color:#102c36;min-width:0}
#ss .sf__head{margin:0 0 6px;padding:0 0 6px;border-bottom:1px solid #102c36;font-family:"Ubuntu","Trebuchet MS","Segoe UI",Arial,sans-serif;font-weight:700;font-size:20px;line-height:1.15;letter-spacing:-.01em;color:#102c36}
#ss .sf__serving{margin:0 0 8px;display:grid;gap:2px;font-size:13.5px;line-height:1.45}
#ss .sf__serving div{display:flex;flex-wrap:wrap;gap:0 6px}
#ss .sf__serving dt{margin:0;font-weight:600;font-family:inherit;font-size:inherit;letter-spacing:normal;text-transform:none;color:#102c36}
#ss .sf__serving dt::after{content:":"}
#ss .sf__serving dd{margin:0}
#ss .sf__table{width:100%;min-width:0;margin:0;border-collapse:collapse;font-size:13.5px;line-height:1.4;background:transparent;font-family:inherit}
#ss .sf__table caption{caption-side:top;text-align:left;padding:6px 0 4px;border-top:1px solid #102c36;font-weight:600;font-size:12.5px;line-height:1.4;font-family:inherit;letter-spacing:normal;text-transform:none;color:#102c36}
#ss .sf__table th,#ss .sf__table td{padding:5px 6px;border:0;border-bottom:1px solid #c4d2cd;vertical-align:top;text-align:left;background:transparent;color:#102c36;font-family:inherit;letter-spacing:normal;text-transform:none}
#ss .sf__table th:first-child,#ss .sf__table td:first-child{padding-left:0}
#ss .sf__table th:last-child,#ss .sf__table td:last-child{padding-right:0}
#ss .sf__table thead th{font-size:12px;font-weight:600;border-bottom:1px solid #102c36}
#ss .sf__table tbody th{font-weight:400;overflow-wrap:anywhere}
#ss .sf__table td,#ss .sf__table thead th + th{text-align:right;white-space:nowrap}
#ss .sf__table tbody tr:last-child > *{border-bottom:1px solid #102c36}
#ss .sf__other{margin:8px 0 4px;font-size:13px;line-height:1.45;color:#102c36}
#ss .sf__legend{margin:0;font-size:12px;line-height:1.45;color:#4b6067}
#ss .sf__notes{margin:0;padding:0 0 0 18px;font-size:13px;line-height:1.45;color:#102c36}
#ss .sf__notes li{margin:0 0 2px}
#ss .sf__check{margin:0;font-size:12px;line-height:1.45;color:#4b6067}
#ss .ss-opts > .sf{margin:2px 0 6px}
/* round 2 (25 Oct 2026): clean jar until the brand, company details from the website, an editable ready formula */
#ss .ss-span2{grid-column:1/-1}
#ss .ss-filled{display:inline-block;align-self:flex-start;justify-self:start;width:max-content;max-width:100%;margin:6px 0 0;padding:2px 10px;border-radius:99px;background:var(--ss-accent-soft);border:1px solid #b8d3dc;font-size:13px;line-height:1.45;color:var(--ss-ink)}
#ss .ss-edited{margin:14px 0 0;padding:12px 14px;border:1px solid var(--ss-rule);border-radius:10px;background:var(--ss-white)}
#ss .ss-edited.is-edited{background:var(--ss-accent-soft);border-color:#b8d3dc}
#ss .ss-edited p{margin:0;font-size:15px}
#ss .ss-edited .ss-row{margin-top:8px}
#ss .ss-edited .ss-row:empty{display:none}
#ss .ss-pv__bare,#ss .ss-pv__empty{margin:8px 0 0;font-size:13px;line-height:1.45;color:var(--ss-muted);text-align:center}
#ss .ss-pv__empty{padding:28px 12px;border:1px dashed var(--ss-rule-strong);border-radius:10px}
#ss .sf__edited{margin:0;font-size:13px;line-height:1.45;color:var(--ss-muted)}
/* wording that does not match the formula (27 Oct 2026) and the calculated capsule fit */
#ss .ss-warn{margin:6px 0 0;padding:10px 12px;background:var(--ss-warn-soft);border:1px solid #e3c98f;border-radius:8px;color:var(--ss-warn);font-size:14px;line-height:1.45}
#ss .ss-warn .ss-btn{display:flex;width:fit-content;margin-top:8px}
#ss .ss-fit{margin:10px 0 0;padding:10px 12px;background:var(--ss-cream);border-radius:8px;font-size:14px;line-height:1.45;color:var(--ss-ink)}
#ss .ss-fit ul{margin:6px 0 0;padding-left:18px}
#ss .ss-fit strong{font-weight:600}
#ss .sf__check p{margin:0}
#ss .sf__check ul{margin:4px 0 0;padding-left:16px}