/* The print workshop (#label-maker.pw-workshop): ChatGPT's approved prototype (02 Prototype/print/app.css, website
   dialog and phone layout) on the site's colour tokens. labels.css still styles the shared dialog frame and the batch
   maker. The printed page in the preview is always white paper, in light and dark appearance. */
.label-maker.pw-workshop { width:min(1180px,calc(100% - 48px));max-height:calc(100dvh - 48px);border-radius:16px;font-family:var(--body);font-size:14px;line-height:1.45;box-shadow:0 22px 70px #17201c32; }
.label-maker.pw-workshop[open] { display:flex;flex-direction:column;height:min(810px,calc(100dvh - 48px));overflow:hidden; }
.pw-workshop button { font:inherit;color:inherit; }
.pw-workshop button:not(:disabled) { cursor:pointer; }

/* Header */
.pw-header { position:relative;z-index:2;flex:none;padding:16px 24px 0;border-bottom:1px solid var(--line);background:var(--panel); }
.pw-brandline { display:flex;align-items:center;gap:15px;min-height:30px; }
.pw-back { display:flex;align-items:center;gap:6px;min-height:30px;padding:3px 8px 3px 0;border:0;background:transparent;color:var(--muted)!important;font-size:12px!important; }
.pw-back:hover { color:var(--orange-text)!important; }
.pw-back .ui-icon { width:15px;height:15px;transform:rotate(180deg); }
.pw-brand { display:flex;align-items:center;gap:7px;color:var(--muted);font-size:9px;font-weight:700;letter-spacing:1.25px; }
.pw-mark { display:grid;place-items:center;width:21px;height:21px;border:3px solid var(--ink);border-radius:6px;transform:rotate(-7deg);flex:none; }
.pw-mark i { width:7px;height:7px;background:var(--accent);border-radius:2px; }
.pw-remembered { display:flex;align-items:center;gap:5px;margin-left:auto;padding:4px 9px;border:1px solid color-mix(in srgb,var(--good) 30%,transparent);border-radius:99px;background:var(--good-bg);color:var(--good);font-size:10px; }
.pw-remembered .ui-icon { width:12px;height:12px;stroke-width:2.4; }
.pw-preview-toggle { display:none;align-items:center;gap:6px;min-height:36px;margin-left:auto;padding:6px 10px;border:1px solid var(--line);border-radius:7px;background:var(--paper);font-size:11px!important;font-weight:700; }
.pw-toggle-icon { width:12px;height:15px;border:1.5px solid currentColor;border-radius:2px;box-shadow:inset 0 4px 0 -2.5px currentColor; }
.pw-title-row { display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:8px 0 14px; }
.pw-workshop #label-maker-h { margin:0;font-family:var(--body);font-size:24px;line-height:1.1;letter-spacing:-.8px; }
.pw-workshop #label-maker-h:focus { outline:none; }
.pw-title-row p { margin:5px 0 0;color:var(--muted);font-size:12px; }
.pw-close { width:32px;height:32px;display:grid;place-items:center;flex:none;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--muted)!important;font-size:20px!important;line-height:1; }
.pw-close:hover { border-color:var(--orange-text);color:var(--orange-text)!important; }
.pw-steps { display:grid;grid-template-columns:repeat(4,minmax(0,1fr)); }
.pw-steps button { position:relative;display:flex;align-items:center;gap:8px;min-width:0;min-height:43px;padding:7px 11px;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--muted)!important;text-align:left;font-size:12px!important; }
.pw-steps button > span { width:21px;height:21px;display:grid;place-items:center;flex:none;border:1px solid var(--line);border-radius:50%;font-size:10px; }
.pw-steps button b { min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.pw-steps button:hover { color:var(--ink)!important; }
.pw-steps button[aria-selected="true"] { border-bottom-color:var(--accent);color:var(--ink)!important; }
.pw-steps button[aria-selected="true"] > span { border-color:var(--accent);background:var(--accent);color:#33271d; }
.pw-steps button.is-done > span { background:var(--soft); }
.pw-steps button:focus-visible { outline-offset:-3px; }

/* Body: the editor scrolls only when it must; the preview stays put */
.pw-body { display:grid;grid-template-columns:minmax(0,1.42fr) minmax(280px,.72fr);flex:1;min-width:0;min-height:0;overflow:hidden; }
.pw-editor { min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:20px 24px 22px;background:var(--panel); }
.pw-panel { max-width:720px;margin:0 auto; }
.pw-step-heading { margin:0 0 17px; }
.pw-overline { display:block;margin-bottom:4px;color:var(--orange-text);font-size:10px;font-weight:700;letter-spacing:1.4px; }
.pw-step-heading h3 { margin:0;font-family:var(--body);font-size:20px;line-height:1.2;letter-spacing:-.5px; }
.pw-step-heading h3:focus { outline:none; }
.pw-step-heading p { margin:5px 0 0;color:var(--muted);font-size:12px;line-height:1.45; }

/* Step 1: what you print on */
.pw-modes { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px; }
.pw-mode { position:relative;min-width:0;min-height:88px;display:flex;align-items:center;gap:11px;padding:12px;border:1px solid var(--line);border-radius:9px;background:var(--paper);text-align:left;transition:background .15s,border-color .15s,box-shadow .15s; }
.pw-mode:hover { border-color:var(--orange-text);background:var(--orange-soft); }
.pw-mode[aria-pressed="true"] { border-color:var(--orange-text);background:var(--orange-soft);box-shadow:inset 0 0 0 1px var(--orange-text); }
.pw-mode > span:nth-child(2) { display:grid;gap:4px;min-width:0;padding-right:12px; }
.pw-mode b { font-size:13px; }
.pw-mode small { color:var(--muted);font-size:11px;line-height:1.3; }
.pw-radio { position:absolute;top:11px;right:11px;width:13px;height:13px;border:1px solid var(--muted);border-radius:50%; }
.pw-mode[aria-pressed="true"] .pw-radio { border:4px solid var(--orange-text);background:var(--panel); }
.pw-mode-icon { width:34px;height:34px;display:flex;align-items:center;justify-content:center;gap:3px;flex:none;border:1px solid var(--line);border-radius:8px;background:var(--panel); }
.pw-icon-sticker { flex-wrap:wrap;align-content:center;padding:6px; }
.pw-icon-sticker i { width:6px;height:8px;border:1px solid var(--muted);border-radius:2px; }
.pw-icon-paper { flex-direction:column;padding:5px; }
.pw-icon-paper i { width:19px;height:1px;background:var(--muted); }
.pw-icon-printer i { width:19px;height:14px;border:1px solid var(--muted);border-radius:3px;box-shadow:4px 4px 0 -2px var(--panel),4px 4px 0 -1px var(--muted); }
.pw-icon-exact i { position:relative;width:19px;height:19px;border:1px solid var(--muted);border-radius:50%; }
.pw-icon-exact i::after { content:"";position:absolute;inset:4px;border:1px dashed var(--muted);border-radius:50%; }
.pw-privacy { display:flex;align-items:center;gap:7px;margin:17px 0 0;color:var(--muted);font-size:11px; }
.pw-privacy .ui-icon { width:15px;height:15px;color:var(--good); }

/* Fields */
.pw-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px; }
.pw-grid + .pw-grid { margin-top:12px; }
.pw-field { min-width:0; }
.pw-field > label,.pw-label,.pw-start-row label { display:block;margin:0 0 5px;font-size:11px;font-weight:700; }
.pw-workshop .pw-field input,.pw-workshop .pw-field select,.pw-workshop .label-custom-grid input,.pw-workshop .label-custom-grid select,.pw-number-unit { width:100%;min-height:38px;padding:7px 10px;border:1px solid var(--line);border-radius:7px;background-color:var(--paper);color:var(--ink);font:inherit;font-size:12px; }
.pw-workshop select,.pw-workshop #label-text-position { appearance:none;padding-right:30px;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 16px) calc(50% + 1px),calc(100% - 11px) calc(50% + 1px);background-size:5px 5px;background-repeat:no-repeat;cursor:pointer; }
.pw-workshop .pw-field input:focus,.pw-workshop .pw-field select:focus,.pw-workshop .label-custom-grid input:focus { border-color:var(--orange-text); }
.pw-workshop input[readonly] { color:var(--muted);background-color:var(--soft); }
.pw-workshop input[aria-invalid="true"] { border-color:var(--bad); }
.pw-workshop input::placeholder { color:var(--muted);opacity:.9; }
.pw-help { margin:6px 0;color:var(--muted);font-size:11px;line-height:1.45; }
.pw-subtle { margin:0 0 8px;color:var(--muted);font-size:11px;font-weight:700; }
.pw-number-unit { display:flex;align-items:center;gap:6px;padding:0 10px; }
.pw-workshop .pw-number-unit input { min-height:36px;padding:5px 2px;border:0;background-color:transparent; }
.pw-number-unit input:focus-visible { outline:none; }
.pw-number-unit:focus-within { border-color:var(--orange-text);outline:3px solid var(--orange-text);outline-offset:2px; }
.pw-number-unit span { flex:none;color:var(--muted);font-size:11px; }
.pw-note { display:flex;align-items:flex-start;gap:8px;margin:14px 0 0;padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--soft);color:var(--muted);font-size:11px;line-height:1.45; }
.pw-note-icon { color:var(--orange-text);font-size:14px;line-height:1.1;flex:none; }
.pw-check { display:flex;align-items:center;gap:8px;min-height:32px;margin-top:8px;font-size:12px;cursor:pointer; }
.pw-check input { width:16px;height:16px;margin:0;flex:none;accent-color:var(--orange-text); }
.pw-switch { position:relative;display:flex;align-items:center;gap:9px;min-height:38px;margin:11px 0 0;font-size:12px;cursor:pointer; }
.pw-switch > input { position:absolute;opacity:0;width:1px;height:1px;margin:0; }
.pw-switch-ui { position:relative;width:30px;height:17px;flex:none;border:1px solid var(--muted);border-radius:99px;background:var(--soft);transition:background .15s; }
.pw-switch-ui::after { content:"";position:absolute;top:2px;left:2px;width:11px;height:11px;border-radius:50%;background:var(--muted);transition:transform .15s,background .15s; }
.pw-switch input:checked + .pw-switch-ui { border-color:var(--orange-text);background:var(--orange-soft); }
.pw-switch input:checked + .pw-switch-ui::after { transform:translateX(13px);background:var(--orange-text); }
.pw-switch input:focus-visible + .pw-switch-ui { outline:3px solid var(--orange-text);outline-offset:2px; }
.pw-secondary,.pw-primary { min-height:38px;padding:7px 13px;border:1px solid var(--line);border-radius:7px;background:var(--panel);font-size:12px!important;font-weight:700;transition:background .15s,border-color .15s; }
.pw-secondary:hover:not(:disabled) { border-color:var(--orange-text);background:var(--orange-soft); }
.pw-primary { display:inline-flex;align-items:center;justify-content:center;gap:10px;border-color:var(--accent);background:var(--accent);color:#30251b!important; }
.pw-primary:hover:not(:disabled) { filter:brightness(1.05); }
.pw-primary:disabled,.pw-secondary:disabled,.pw-test-link:disabled { opacity:.55;cursor:not-allowed; }
.pw-primary[aria-busy="true"] { cursor:progress; }
.pw-text-link,.pw-test-link { display:inline-flex;align-items:center;gap:5px;min-height:32px;padding:4px 2px;border:0;background:none;color:var(--orange-text)!important;font-size:12px!important;font-weight:700;text-decoration:underline;text-underline-offset:3px; }
.pw-text-link:hover,.pw-test-link:hover:not(:disabled) { color:var(--ink)!important; }

/* Step 2: sticker sheets */
.pw-workshop .pw-custom { margin-top:10px;border:1px solid var(--line);border-radius:8px;background:var(--paper); }
.pw-workshop .pw-custom summary { padding:9px 11px;font-size:12px;font-weight:700;cursor:pointer; }
.pw-workshop .pw-custom[open] { padding:0 11px 11px; }
.pw-workshop .pw-custom[open] summary { margin:0 -11px;border-bottom:1px solid var(--line); }
.pw-workshop .label-custom-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 11px; }
.pw-workshop .label-custom-grid .label-field { margin:0; }
.pw-workshop .label-custom-grid label { display:block;margin:0 0 4px;font-size:11px;font-weight:700; }
.pw-workshop .label-custom-grid input,.pw-workshop .label-custom-grid select { min-height:34px;padding:5px 8px;background-color:var(--panel);font-size:12px; }
.pw-workshop .label-custom-grid select { padding-right:28px; }
.pw-error { margin:8px 0 0;padding:9px 10px;border:1px solid var(--bad);border-radius:7px;background:var(--bad-bg);color:var(--bad);font-size:11px;line-height:1.45; }
.pw-error b { display:block;font-size:12px; }
.pw-error p { margin:3px 0 0; }
.pw-fill { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:14px; }
.pw-choice { display:flex;align-items:center;gap:9px;min-width:0;min-height:54px;padding:9px 11px;border:1px solid var(--line);border-radius:8px;background:var(--paper);cursor:pointer; }
.pw-choice:has(input:checked) { border-color:var(--orange-text);background:var(--orange-soft); }
.pw-choice input { width:15px;height:15px;min-width:15px;margin:0;accent-color:var(--orange-text); }
.pw-choice b { display:block;font-size:12px; }
.pw-choice small { display:block;margin-top:2px;color:var(--muted);font-size:11px;line-height:1.3; }
.pw-start-row { display:flex;align-items:center;gap:16px;margin:14px 0 4px; }
.pw-start-row > div { flex:1;min-width:0; }
.pw-start-row label { margin-bottom:2px; }
.pw-start-row .pw-help { margin:0;max-width:300px; }
.pw-workshop .pw-start-row input { width:72px;min-height:38px;flex:none;padding:6px;border:1px solid var(--line);border-radius:7px;background:var(--paper);color:var(--ink);font:inherit;font-size:13px;font-weight:700;text-align:center; }

/* Step 2: exact size */
/* Plain paper: layout tiles, per-page picks and your own layout (3 Nov 2026) */
.pw-field-end { display:flex;align-items:flex-end; }
.pw-lay-h { margin-top:16px; }
.pw-tiles { display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:8px; }
.pw-tile { position:relative;display:grid;justify-items:center;align-content:start;gap:3px;min-height:132px;padding:9px 7px 8px;border:1px solid var(--line);border-radius:9px;background:var(--paper);text-align:center;font-size:11px!important;line-height:1.25;transition:background .15s,border-color .15s; }
.pw-tile:hover,.pw-tile[aria-pressed="true"] { border-color:var(--orange-text);background:var(--orange-soft); }
.pw-tile[aria-pressed="true"] { box-shadow:inset 0 0 0 1px var(--orange-text); }
.pw-tile svg { width:auto;height:58px;margin-bottom:4px;overflow:visible; }
.pw-tile svg .pg { fill:var(--panel);stroke:var(--muted);stroke-width:1.2px;vector-effect:non-scaling-stroke; }
.pw-tile svg .cl { fill:var(--soft);stroke:var(--orange-text);stroke-width:.8px;vector-effect:non-scaling-stroke; }
.pw-tile b { font-weight:700;color:var(--ink); }
.pw-tile small { color:var(--muted);font-size:10px; }
.pw-tile.is-small small.pw-warn { color:var(--warn);font-weight:700; }
.pw-tile-x { position:absolute;top:3px;right:3px;width:24px;height:24px;display:grid;place-items:center;border-radius:50%;color:var(--muted)!important;font-size:15px!important;line-height:1; }
.pw-tile-x:hover { color:var(--orange-text)!important;background:var(--panel); }
.pw-counts { display:flex;flex-wrap:wrap;gap:6px; }
.pw-counts button { min-width:46px;min-height:40px;padding:6px 10px;border:1px solid var(--line);border-radius:20px;background:var(--paper);font-size:12px!important;font-weight:700;transition:background .15s,border-color .15s; }
.pw-counts button:hover,.pw-counts button[aria-pressed="true"] { border-color:var(--orange-text);background:var(--orange-soft);color:var(--orange-text)!important; }
.pw-own { margin-top:14px;padding:0 12px;border:1px solid var(--line);border-radius:9px;background:var(--paper); }
.pw-own > summary { min-height:42px;display:flex;align-items:center;margin:0 -12px;padding:8px 12px;font-size:12px;font-weight:700;cursor:pointer; }
.pw-own[open] > summary { border-bottom:1px solid var(--line); }
.pw-own-by { display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:8px;margin-bottom:8px; }
.pw-own-save { display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:10px;margin-top:12px;margin-bottom:12px; }
.pw-lay-summary { margin:12px 0;padding:9px 11px;border-radius:8px;background:var(--soft);font-size:12px;line-height:1.45; }
.pw-lay-summary:empty { display:none; }
.pw-lay-summary.is-warn { color:var(--warn);font-weight:700; }
.pw-presets { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:0 0 14px; }
.pw-presets button { display:grid;align-content:center;gap:2px;min-height:48px;padding:5px;border:1px solid var(--line);border-radius:7px;background:var(--paper);font-size:11px!important;line-height:1.2;transition:background .15s,border-color .15s; }
.pw-presets small { color:var(--muted);font-size:10px; }
.pw-presets button:hover,.pw-presets button[aria-pressed="true"] { border-color:var(--orange-text);background:var(--orange-soft);color:var(--orange-text)!important; }
.pw-distance { max-width:320px;margin-top:12px; }
.pw-recommend { display:flex;align-items:center;gap:8px;margin:12px 0 6px;padding:9px 11px;border:1px solid color-mix(in srgb,var(--good) 30%,transparent);border-radius:8px;background:var(--good-bg);color:var(--good);font-size:11px; }
.pw-recommend > b { margin-left:auto;font-size:13px; }
.pw-recommend > span:first-child { font-size:15px; }

/* Step 3: text */
.pw-style-row { display:flex;align-items:center;flex-wrap:wrap;gap:12px 22px;margin-top:12px; }
.pw-style-row .pw-check { margin:0; }
.pw-colors { display:flex;align-items:center;gap:12px; }
.pw-colors .pw-label { margin:0; }
.pw-inks { display:flex;align-items:center;gap:8px; }
.pw-ink { width:26px;height:26px;padding:0;border:2px solid var(--panel);border-radius:50%;background:var(--pw-ink);box-shadow:0 0 0 1px var(--line); }
.pw-ink.pw-ink-pale { box-shadow:0 0 0 1px #b8b3a2; }
.pw-ink[aria-pressed="true"] { box-shadow:0 0 0 2px var(--orange-text); }
.pw-wifi { margin-top:14px;padding:11px;border:1px solid var(--line);border-radius:9px;background:var(--soft); }
.pw-wifi .pw-switch { margin:0; }
.pw-wifi-details { padding:10px 0 2px; }
.pw-wifi-details .pw-grid { margin-top:10px; }
.pw-wifi .pw-field input:not([readonly]) { background-color:var(--panel); }
#pw-heading-field { margin-bottom:12px; }

/* Step 4: check & print */
.pw-warning-group { margin-bottom:14px; }
.pw-warning-group h4,.pw-card h4 { margin:0;font-family:var(--body);font-size:13px;letter-spacing:-.1px; }
.pw-warnings,.pw-alerts { display:grid;gap:7px;margin:8px 0 0;padding:0;list-style:none; }
.pw-warning { display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:start;padding:9px 10px;border:1px solid color-mix(in srgb,var(--orange-text) 28%,transparent);border-radius:8px;background:var(--orange-soft);color:var(--ink);font-size:11px;line-height:1.4; }
.pw-warning::before { content:"!";grid-row:1 / span 2;width:16px;height:16px;display:grid;place-items:center;border:1px solid var(--orange-text);border-radius:50%;color:var(--orange-text);font-size:10px;font-weight:700; }
.pw-warning b { font-weight:700; }
.pw-warning span { grid-column:2;color:var(--muted); }
.pw-warning.is-good { border-color:color-mix(in srgb,var(--good) 30%,transparent);background:var(--good-bg); }
.pw-warning.is-good::before { content:"✓";border-color:var(--good);color:var(--good); }
.pw-warning.is-good b { font-weight:500; }
.pw-card { margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:9px;background:var(--paper); }
.pw-sub-head { display:flex;align-items:flex-start;gap:9px; }
.pw-sub-icon { width:24px;height:24px;display:grid;place-items:center;flex:none;border:1px solid var(--line);border-radius:7px;background:var(--panel);color:var(--orange-text);font-size:14px; }
.pw-sub-head p { margin:4px 0 0;color:var(--muted);font-size:11px;line-height:1.4; }
.pw-nudge-row { display:grid;grid-template-columns:110px minmax(0,1fr) 52px;align-items:center;gap:8px;margin-top:10px; }
.pw-nudge-row label { font-size:11px;font-weight:700; }
.pw-nudge-row input { width:100%;accent-color:var(--orange-text); }
.pw-nudge-row output { color:var(--muted);font-size:11px;text-align:right;white-space:nowrap; }
.pw-align-actions { display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:10px; }
.pw-saved-note { display:flex;align-items:flex-start;gap:6px;margin:9px 0 0;color:var(--muted);font-size:11px;line-height:1.4; }
.pw-saved-note .ui-icon { width:13px;height:13px;margin-top:1px;color:var(--good);stroke-width:2.4; }
.pw-shop-grid { align-items:end;margin-top:12px; }
.pw-shop-grid .pw-switch { margin:0 0 2px; }
.pw-background-field { max-width:240px;margin-top:10px; }
.pw-shop-actions { margin-top:12px; }

/* Preview */
.pw-preview { position:relative;display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden;padding:18px 16px;border-left:1px solid var(--line);background:var(--paper); }
.pw-preview-head { display:flex;align-items:flex-start;justify-content:space-between;gap:9px;flex:none;margin-bottom:9px; }
.pw-preview-head > div { display:grid;gap:4px; }
.pw-kicker { font-size:12px;font-weight:700; }
.pw-preview-state { display:flex;align-items:center;gap:5px;color:var(--muted);font-size:10px; }
.pw-preview-state i { width:5px;height:5px;flex:none;border-radius:50%;background:var(--good); }
.pw-preview-close { display:none;width:32px;height:32px;place-items:center;flex:none;border:1px solid var(--line);border-radius:50%;background:var(--panel);font-size:18px!important;line-height:1; }
.pw-summary { display:flex;align-items:center;justify-content:space-between;gap:8px;flex:none;padding:8px 10px;border:1px solid var(--line);border-radius:7px;background:var(--panel); }
.pw-summary > div { min-width:0; }
.pw-summary b,.pw-summary small { display:block; }
.pw-summary b { font-size:11px; }
.pw-summary small { margin-top:2px;overflow:hidden;color:var(--muted);font-size:10px;text-overflow:ellipsis;white-space:nowrap; }
.pw-zoom { flex:none;padding:3px 6px;border:1px solid var(--line);border-radius:4px;color:var(--muted);font-size:10px; }
.pw-stage { position:relative;display:grid;place-items:center;flex:none;height:clamp(185px,31vh,290px);min-height:180px;margin:10px 0 7px;padding:12px;overflow:hidden;border:1px solid var(--line);border-radius:9px;background-color:var(--soft);background-image:radial-gradient(var(--peg) .7px,transparent .8px);background-size:12px 12px; }
.pw-page { position:relative;overflow:visible;background:#fff;color:#22252A;border:1px solid #e2e3dd;box-shadow:0 5px 15px #1c241c15; }
.pw-page.is-printer { border-radius:4px; }
.pw-page.is-printer.is-roll { box-shadow:0 -12px 0 -1px #fbfaf6,0 12px 0 -1px #fbfaf6,0 -12px 0 0 #e2e3dd,0 12px 0 0 #e2e3dd,0 5px 15px #1c241c15; }
.pw-page.is-printer.has-copies { box-shadow:5px 5px 0 -1px #fff,5px 5px 0 0 #d9d8d0,0 5px 15px #1c241c15; }
.pw-page.is-exact { background:#fff; }
.pw-layer { position:absolute;inset:0; }
.pw-sticker,.pw-cell,.pw-bleed,.pw-trim,.pw-crop,.pw-fold,.pw-code,.pw-item,.pw-text { position:absolute;box-sizing:border-box; }
.pw-sticker { padding:0;overflow:hidden;border:1px solid #dedfd8;background:#fff;color:#22252A;box-shadow:none; }
.pw-sticker:hover { z-index:1;border-color:#98501D; }
.pw-sticker.has-outline { border-color:#8a9185; }
.pw-sticker[aria-pressed="true"] { z-index:2;border:2px solid #98501D;background:#fff5e8; }
.pw-sticker.is-skipped { border-style:dashed;background:repeating-linear-gradient(135deg,#f2f3ef 0 2px,#fafbf8 2px 5px); }
.pw-sticker.is-unused { background:#fff;border-style:dashed; }
.pw-sticker:focus-visible { z-index:3;outline:2px solid #98501D;outline-offset:1px; }
.pw-cell { overflow:hidden; }
.pw-cell.has-cut { border:1px solid #c8c6bd; }
.pw-cell.is-unused { background:repeating-linear-gradient(135deg,#f6f6f2 0 2px,#fff 2px 6px); }
.pw-fold { border-top:1px dashed #a9a79c; }
.pw-item { inset:0; }
.pw-item.is-turned { transform:rotate(180deg); }
.pw-code { display:block;max-width:none;object-fit:fill;mix-blend-mode:multiply; }
.pw-page.is-exact .pw-code { mix-blend-mode:normal; }
.pw-text { display:block;overflow:hidden;font-family:Karla,var(--body);font-weight:500;white-space:nowrap;text-overflow:ellipsis; }
.pw-text.is-bold { font-weight:700; }
.pw-trim { border:1px dashed #9da096; }
.pw-crop { border-top:1px solid #111; }
.pw-crop.is-v { border-top:0;border-left:1px solid #111; }
.pw-key { display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;flex:none;margin:1px 0 5px;color:var(--muted);font-size:10px; }
.pw-key > span { display:flex;align-items:center;gap:4px; }
.pw-key i { width:9px;height:9px;border:1px solid var(--muted);border-radius:2px;background:var(--panel); }
.pw-key .pw-key-start { border:2px solid var(--orange-text);background:var(--orange-soft); }
.pw-key .pw-key-skip { border-style:dashed;background:var(--soft); }
.pw-nudge-meta { flex:none;margin:0 0 4px;color:var(--orange-text);font-size:10px;font-weight:700;text-align:center; }
.pw-alerts { flex:none;gap:5px;margin-top:5px; }
.pw-alerts .pw-warning { padding:6px 7px;font-size:10px; }
.pw-alerts .pw-warning::before { width:14px;height:14px;font-size:9px; }
.pw-forget { align-self:center;flex:none;margin-top:auto;padding:4px;border:0;background:none;color:var(--muted)!important;font-size:10px!important;text-decoration:underline;text-underline-offset:2px; }

/* Footer */
.pw-footer { z-index:3;flex:none;display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:66px;padding:10px 20px;border-top:1px solid var(--line);background:var(--panel); }
.pw-reminder { display:flex;align-items:center;gap:9px;min-width:0; }
.pw-scale { width:36px;height:36px;display:grid;place-items:center;flex:none;border:1px solid var(--line);border-radius:50%;color:var(--orange-text);font-size:10px;font-weight:700; }
.pw-reminder p { margin:0; }
.pw-reminder b,.pw-reminder p span { display:block; }
.pw-reminder b { font-size:11px; }
.pw-reminder p span { margin-top:2px;color:var(--muted);font-size:10px; }
.pw-actions { display:flex;align-items:center;gap:8px; }
.pw-actions .pw-secondary { min-width:62px; }
.pw-step-count { min-width:36px;color:var(--muted);font-size:10px;text-align:center; }
.pw-download { min-width:210px; }
.pw-toast { position:absolute;left:50%;bottom:78px;z-index:20;max-width:min(560px,calc(100% - 28px));padding:10px 16px;border-radius:8px;background:var(--ink);color:var(--paper);box-shadow:0 8px 22px #0003;font-size:12px;text-align:center;opacity:0;pointer-events:none;transform:translate(-50%,8px);transition:opacity .18s,transform .18s; }
.pw-toast.show { opacity:1;transform:translate(-50%,0); }

/* Laptop heights */
@media (max-height:760px) and (min-width:761px) {
  .pw-header { padding-top:11px; }
  .pw-title-row { padding:5px 0 8px; }
  .pw-workshop #label-maker-h { font-size:21px; }
  .pw-steps button { min-height:39px; }
  .pw-editor { padding:15px 21px 12px; }
  .pw-step-heading { margin-bottom:11px; }
  .pw-mode { min-height:76px; }
  .pw-preview { padding:12px; }
  .pw-preview-head { margin-bottom:6px; }
  .pw-summary { padding:6px 8px; }
  .pw-stage { height:clamp(140px,24vh,190px);min-height:135px;margin:7px 0 5px; }
  .pw-alerts .pw-warning { padding:4px 6px; }
  .pw-footer { min-height:58px;padding-top:7px;padding-bottom:7px; }
}
@media (max-width:1050px) and (min-width:761px) {
  .label-maker.pw-workshop { width:calc(100% - 32px);max-height:calc(100dvh - 32px); }
  .label-maker.pw-workshop[open] { height:min(810px,calc(100dvh - 32px)); }
  .pw-header { padding-left:18px;padding-right:18px; }
  .pw-body { grid-template-columns:minmax(0,1.16fr) minmax(265px,.84fr); }
  .pw-editor { padding:17px 18px; }
  .pw-preview { padding:15px 12px; }
  .pw-reminder p span { display:none; }
}

/* Phones: stacked steps, a bottom action bar, the preview on demand */
@media (max-width:760px) {
  .label-maker.pw-workshop { width:100%;max-width:100%;max-height:100dvh;margin:0;border:0;border-radius:0; }
  .label-maker.pw-workshop[open] { display:flex;height:100dvh; }
  .pw-header { padding:10px 14px 0;padding-top:calc(10px + env(safe-area-inset-top,0px)); }
  .pw-brandline { gap:8px;min-height:36px; }
  .pw-brand { font-size:8px;letter-spacing:.8px; }
  .pw-back { min-height:44px;max-width:150px; }
  .pw-remembered { display:none!important; }
  .pw-preview-toggle { display:flex; }
  .pw-title-row { padding:4px 0 10px; }
  .pw-workshop #label-maker-h { font-size:20px; }
  .pw-title-row p { font-size:11px; }
  .pw-close { display:none; }
  .pw-steps { grid-template-columns:repeat(4,minmax(78px,1fr));overflow-x:auto;margin-right:-14px;scrollbar-width:none; }
  .pw-steps button { min-height:44px;padding:6px 7px;gap:5px;font-size:11px!important; }
  .pw-steps button > span { width:19px;height:19px; }
  .pw-steps button b { white-space:normal;line-height:1.15; }
  .pw-body { position:relative;display:block; }
  .pw-editor { height:100%;padding:16px 14px 22px;scrollbar-gutter:auto; }
  .pw-step-heading { margin-bottom:13px; }
  .pw-step-heading h3 { font-size:18px; }
  .pw-modes,.pw-grid,.pw-fill { grid-template-columns:1fr; }
  .pw-modes { gap:8px; }
  .pw-mode { min-height:72px;padding:10px; }
  .pw-presets { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .pw-tiles { grid-template-columns:repeat(3,minmax(0,1fr));gap:6px; }
  .pw-tile { min-height:112px;padding:7px 4px; }
  .pw-tile svg { height:44px; }
  .pw-own-save { grid-template-columns:1fr; }
  .pw-workshop .pw-field input,.pw-workshop .pw-field select,.pw-workshop .label-custom-grid input,.pw-workshop .label-custom-grid select,.pw-workshop .pw-start-row input,.pw-workshop .pw-number-unit input { min-height:44px;font-size:16px; }
  .pw-nudge-row { grid-template-columns:92px minmax(0,1fr) 48px; }
  .pw-nudge-row input { min-height:44px; }
  .pw-preview { display:none; }
  .pw-show-preview .pw-preview { position:absolute;inset:0;z-index:10;display:flex;overflow:auto;padding:14px;border-left:0; }
  .pw-preview-close { display:grid; }
  .pw-stage { height:clamp(220px,46vh,380px); }
  .pw-forget { margin-top:12px; }
  .pw-footer { min-height:60px;gap:8px;padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px)); }
  .pw-reminder,.pw-actions .pw-test-link { display:none; }
  .pw-actions { width:100%;justify-content:space-between;gap:6px; }
  .pw-actions .pw-primary { min-height:44px;flex:1;max-width:240px;padding:7px 10px; }
  .pw-actions .pw-secondary { min-height:44px; }
  .pw-download { min-width:0; }
  .pw-toast { bottom:72px; }
}
@media (max-width:360px) {
  .pw-brand { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  .pw-workshop *,.pw-workshop *::before,.pw-workshop *::after { transition:none!important;scroll-behavior:auto!important; }
}