/* ipp-layout-v1.0.18.css */
/* ============================================================
   ipp-layout-v1.0.18.css — Layout view for the IPP
   Pairs ipp-layout-v1.0.30.js. Replaces v1.0.17.

   v1.0.18 (16 Oct 2026) — the group panel's ground is the teal wash
     Jeff chose (A): --ly-pair #A9C3BF hairline, --ly-pair-bg #E9F1EF,
     the brand teal (--ix-teal) as the left accent, labels in teal,
     the end label in a muted teal. Only the colour tokens in the
     v1.0.17 block changed.

   v1.0.17 (16 Oct 2026) — the group is a panel (replaces the v1.0.16
     bars; the v1.0.16 block is cut, the rest of the file unchanged).
     .ipp-ly-pair is the panel: warm wash, gold hairline, 3px gold
     accent left, 10px inset, radius 10. .ipp-ly-ghead is the header
     row (36px): handle, number, type tag, the name as a small-caps
     mono label, design dropdown, links. .ipp-ly-gfoot is the footer
     row (22px): handle, hairline, "end · name" label right.

   v1.0.16 (16 Oct 2026) — the pair is a bracket. The v1.0.14 pair
     rules are replaced at the end of the file (they are left in place
     above and overridden; nothing else above changed):
     · .ipp-ly-pair: no box. A 3px left stroke in --ly-pair, the group
       indented 18px, the two bars closing the "C" top and bottom.
     · .ipp-ly-tile.is-bar: one-line bars on the tint ground
       (--ly-pair-bg): the opener bar 34px, the end bar 26px. Their
       own grid (.ipp-ly-brow, same columns as a tile): handle · number · type tag · name ·
       design dropdown · links.
     · Tint: --ly-pair #C9A84C, --ly-pair-bg #FBF6E3 by default, set
       per pair inline from a design swatch when the data has one.

   v1.0.15 (15 Oct 2026) — .ipp-ly-n: the position number at the start
     of a Before Publish / Heads up line, in the tile's mono style
     (same font and colour as .ipp-ly-pos), fixed 22px, right-aligned,
     so the number on the card and the number on the tile read as one.
     One rule appended at the end; nothing above it changed.

   v1.0.14 (15 Oct 2026, IPP Build S19) — pairs, Add, less on the tile.
     One block appended at the end; nothing above it changed.
     · .ipp-ly-art.is-clear: the 72 x 40 slot with no ground (an empty
       article tile, a pending new tile, an end tile). The slot stays,
       so the title keeps its line; only the beige box goes.
     · .ipp-ly-pair: the frame around an opener, its group and its end
       tile (the Default Layout's pair frame, same ink and radius);
       .ipp-ly-tile.is-inside is indented 18px inside it.
     · .ipp-ly-tile.is-end: the end tile, same 56px head as every tile,
       dashed edge, muted "<name> · end" title, no art, no type.
     · .ipp-ly-tile.is-new: gold edge (pending), as a changed tile.
     · .ipp-ly-addrow: the fixed row under the stack: "Add" and one
       110px button per kind (ix ghost button look; labels truncate).

   v1.0.13 (15 Oct 2026) — the Remove link on every tile.
     One block appended at the end; nothing above it changed.
     · .ipp-ly-links: Cancel and Remove side by side on the tile's
       last line (11px, 10px gap), so the right column keeps its 56px.
     · .ipp-ly-rm: 11px on the tile, same red; .is-off is grey with the
       reason in its title (a block with content, says why on click).
     · .ipp-ly-tile.is-removing: gold edge, title struck through (as
       v1.0.5 did for the weather tile), design column reads
       "Will be removed".

   v1.0.12 (13 Oct 2026) — the weather tile's line never truncates.
     One block appended at the end; nothing above it changed.
     · .ipp-ly-tile.is-wx .ipp-ly-grid1: auto height, min 56px, the text
       column padded 9px top and bottom so the title starts on the same
       line as every other tile's title (56px centred, 38px of text).
     · .ipp-ly-l2.is-wx: auto height, one full-width column (the EC and
       section columns are empty on a weather tile and are not drawn).
     · .ipp-ly-s.is-wrap: wraps, no ellipsis, line-height 1.4.
     · .ipp-ly-wxpill: fixed 104px pill before the sentence; is-ok green,
       is-bad red (the tile edge's colours), is-wait grey; its own text
       truncates inside, the sentence never does.

   v1.0.11 (13 Oct 2026) — the open article block. One block appended
     at the end; nothing above it changed.
     · .ipp-ly-type.is-open: "Open", dashed grey edge, wider for the word.
     · .ipp-ly-dtx.is-off: "Design after an article", plain grey text.
     No new tokens.

   v1.0.10 (Layout Preview · S2, 12 Oct 2026) — Before Publish only when needed
     · .ipp-ly-check.is-note: the heads-up-only card, grey edge on white.
     · .ipp-ly-chk:empty takes no room, so Preview fills the column.

   v1.0.9 (Layout Preview · S2, 12 Oct 2026) — Preview
     · The right column is Before Publish (its height) over the Preview
       card, which fills the rest. The column itself no longer scrolls;
       each page scrolls inside its own pane.
     · .ipp-ly-seg: Email / Even / Web. .ipp-ly-panes[data-split] shows
       one page or both.
     · .ipp-ly-pvf: the page, drawn at its real width and scaled to fit
       (the scale is set inline by the script).
     · .ipp-ly-pvnote.is-behind: gold, the preview is behind the layout.
       .is-bad: salmon, the preview could not be made.

   v1.0.8 (Layout tiles · S1, 12 Oct 2026) — fixed icons, option B
     · .ipp-ly-art.is-k-<kind>: the kind's pale ground plus a faint
       pattern (greeting arcs, event hatching, re dots).
     · .ipp-ly-disc: a 28px white disc holding the 17px icon in the
       kind's deeper hue. The 72 x 40 slot is unchanged.
     · Colours are tokens on .ipp-ly (--ly-k-*), so a title skin can
       override them later without touching these rules.

   v1.0.7 (Layout tiles · S1, 12 Oct 2026) — dropdowns on the tile
     · The tile head is handle 14 · position 18 · type 44 · the block
       (art 72 + text, fills) · right column 150. Position, type and
       the right column sit outside the tile's open button, so a
       dropdown never opens the tile.
     · .ipp-ly-tsel / .ipp-ly-dsel: the type and design dropdowns.
       Changed = 2px gold border on a pale gold ground; wrong design =
       salmon border. The Cancel link sits under the design dropdown.
     · The line under the title is EC 24 · byline · franchise 112 (the
       design moved to the right column).
     · .ipp-ly-open now holds review cards only: picture 112 x 63, then
       label / value lines. .ipp-ly-miss names what is missing in salmon.
       The Move, Type and Design rows of v1.0.5 are removed.

   v1.0.6 (Layout tiles · S1, 12 Oct 2026) — list tiles
     · .ipp-ly-art.is-icon: the fixed calendar / house icon, ink on the
       cream slot, centred in the same 72 x 40 slot.
     · .ipp-ly-items: the open list tile's items. Each line is a fixed
       28px: number 16 · picture 40 x 22 · name (fills) · date 150.

   v1.0.5 (Layout tiles · S1, 12 Oct 2026) — the tile redesign
     Frame 6 v3 of the canvas "PubPlan Layout tab · S12 mockup".
     · .ipp-ly-tile: handle 14 · then one button holding position 18 ·
       type 32 · art 72 · text. Head is a fixed 56px; the inside-ad
       strip adds a fixed 30px. Tiles never grow with their words;
       long words are cut with an ellipsis.
     · Art sits in a fixed 72 x 40 slot (banners 72 x 18, centred).
     · Line under the title: EC 24 · byline (fills) · franchise 112 ·
       design 104. The 24px EC slot is on every tile, so the bylines
       start on one vertical line too.
     · .is-banner: #EEF1F6 ground; the customer name in italic.
     · .ipp-ly-ec: filled teal #2F6F73. Teal because gold means
       unsaved and salmon means needs you.
     · .is-open: the tile opens in place (Move, Type, Design, Cancel),
       ink ring as the old selected row had.
     · The stack is 620px at most; the right column takes the rest and
       holds Before Publish (Preview in S2).
     The weather tile, tray, rail tab and Before Publish rules carry
     over from v1.0.4 unchanged.
   Earlier history: see ipp-layout-v1.0.4.css.
   ============================================================ */
.ipp-view[data-view="layout"] .ipp-canvas{display:flex;flex-direction:column;min-height:0}
.ipp-ly{--ly-gold:var(--ix-gold,#C4A35A);--ly-salmon:var(--ix-salmon,#EC7259);--ly-salmon-ink:var(--ix-salmon-ink,#C0432B);
  --ly-ink:var(--ix-text-dark,#1E2A3A);--ly-mid:var(--ix-text-mid,#5A6478);--ly-border:var(--ix-border,#E4E0D4);
  --ly-cream:var(--ix-cream,#FAF9F5);--ly-sand:var(--ix-border-soft,#EEE9DC);--ly-ec:#2F6F73;--ly-ban:#EEF1F6;
  --ly-k-gr-bg:#F4E6DC;--ly-k-gr-ink:#8A5A44;--ly-k-gr-line:#E9D3C3;
  --ly-k-ev-bg:#E5ECDD;--ly-k-ev-ink:#4E6B3E;--ly-k-ev-line:#CFDDC3;
  --ly-k-re-bg:#ECE6F0;--ly-k-re-ink:#5E4A7A;--ly-k-re-line:#DACFE3;
  display:flex;flex-direction:column;flex:1;min-height:0;font-family:var(--ix-font-body,'DM Sans',system-ui,sans-serif);color:var(--ly-ink)}

/* head */
.ipp-ly-head{display:flex;align-items:baseline;gap:12px;flex:none;margin-bottom:12px}
.ipp-ly-h2{margin:0;font:600 22px var(--ix-font-display,'Fraunces',Georgia,serif);color:var(--ly-ink)}
.ipp-ly-hint{font-size:13px;color:var(--ly-mid);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ipp-ly-info{flex:none}
.ipp-ly-msgline{flex:none;margin:0 0 12px;padding:10px 14px;border-radius:10px;background:#fff;border:1px solid var(--ly-border);font-size:13px;line-height:1.45}
.ipp-ly-msgline.is-bad{border-color:var(--ly-salmon);color:var(--ly-salmon-ink)}
.ipp-ly-wait{font-size:13px;color:var(--ly-mid);margin:8px 2px}

/* body: stack + right column */
.ipp-ly-body{flex:1;min-height:0;display:flex;gap:24px}
.ipp-ly-stack{position:relative;flex:0 1 620px;min-width:480px;overflow-y:auto;display:flex;flex-direction:column;gap:5px;padding:2px 4px 72px 2px}
.ipp-ly-stack::-webkit-scrollbar{width:8px}
.ipp-ly-stack::-webkit-scrollbar-thumb{background:var(--ix-border-input,#DDD9C8);border-radius:4px}
.ipp-ly-side{flex:1 1 300px;min-width:280px;min-height:0;display:flex;flex-direction:column;gap:12px;padding:2px 2px 64px}
.ipp-ly-chk{flex:none}

/* a tile */
.ipp-ly-tile{flex:none;box-sizing:border-box;border-radius:9px;background:#fff;border:1px solid var(--ly-border)}
.ipp-ly-tile.is-banner{background:var(--ly-ban)}
.ipp-ly-tile.is-open{box-shadow:0 0 0 2px var(--ly-ink)}
.ipp-ly-tile.ipp-dirty{border:2px solid var(--ly-gold);margin:-1px}
.ipp-ly-tile.is-dragging{opacity:.45}
.ipp-ly-tr{position:relative;display:grid;grid-template-columns:14px 18px 44px minmax(0,1fr) 150px;gap:0 8px;align-items:start;padding:0 10px 0 7px}
.ipp-ly-tr>.ipp-ly-pos,.ipp-ly-tc{height:56px;display:flex;align-items:center}
.ipp-ly-tr>.ipp-ly-pos{justify-content:flex-end}
.ipp-ly-h{width:14px;height:56px;display:flex;align-items:center;justify-content:center;border:0;background:none;padding:0;
  color:#9AA0AC;border-radius:4px;cursor:grab;touch-action:none}
.ipp-ly-h:hover{color:var(--ly-ink)}
.ipp-ly-h:focus-visible{outline:2px solid var(--ly-ink);outline-offset:1px}
.ipp-ly-lock{cursor:default}
.ipp-ly-lock:hover{color:#9AA0AC}
.ipp-ly-main{display:flex;flex-direction:column;width:100%;min-width:0;border:0;background:none;padding:0;margin:0;
  text-align:left;cursor:pointer;color:inherit;font:inherit}
.ipp-ly-main:focus-visible{outline:2px solid var(--ly-ink);outline-offset:2px;border-radius:6px}
.ipp-ly-grid1{display:grid;grid-template-columns:72px minmax(0,1fr);gap:0 8px;align-items:center;height:56px}
.ipp-ly-pos{font:500 11px var(--ix-font-mono,'DM Mono',ui-monospace,monospace);color:var(--ly-mid);text-align:right}
.ipp-ly-type{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:32px;height:18px;border-radius:4px;
  background:var(--ly-sand);font:600 9px var(--ix-font-mono,'DM Mono',ui-monospace,monospace);color:var(--ly-ink);white-space:nowrap;overflow:hidden}
.ipp-ly-type.is-none{background:#fff;box-shadow:inset 0 0 0 1.5px var(--ly-salmon);color:var(--ly-salmon-ink)}
.ipp-ly-type.is-changed{background:#FBF4E2;box-shadow:inset 0 0 0 1.5px var(--ly-gold)}
.ipp-ly-art{width:72px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:4px;background:#F6F3EA;overflow:hidden}
.ipp-ly-tile.is-banner .ipp-ly-art{background:transparent}
.ipp-ly-img{display:block;width:72px;height:40px;object-fit:cover;border-radius:4px}
.ipp-ly-img.is-ban{height:18px;border-radius:2px}
.ipp-ly-img.is-empty{background:transparent}
.ipp-ly-tx{min-width:0;display:flex;flex-direction:column;gap:6px}
.ipp-ly-t{min-width:0;font-weight:600;font-size:13px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ipp-ly-t.is-cust{font-style:italic}
.ipp-ly-t.is-empty{color:var(--ly-mid);font-weight:500}
.ipp-ly-tile.is-removing .ipp-ly-t{text-decoration:line-through;color:var(--ly-mid)}
.ipp-ly-l2{display:grid;grid-template-columns:24px minmax(0,1fr) 112px;gap:0 8px;align-items:center;height:16px}
.ipp-ly-ecs{display:flex;align-items:center}
.ipp-ly-ec{display:inline-flex;align-items:center;justify-content:center;width:22px;height:15px;border-radius:3px;background:var(--ly-ec);
  color:#fff;font:700 8.5px var(--ix-font-body,'DM Sans',sans-serif);letter-spacing:.04em}
.ipp-ly-s{min-width:0;font-size:11px;color:#3A4558;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ipp-ly-tile.is-failed .ipp-ly-s{color:var(--ly-salmon-ink);font-weight:600}
.ipp-ly-fr{min-width:0;display:flex;align-items:center;gap:4px}
.ipp-ly-frdot{width:10px;height:10px;border-radius:2px;background:#9AA585;flex:none}
.ipp-ly-frn{min-width:0;font-size:10px;color:var(--ly-mid);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ipp-ly-d{min-width:0;font-size:10px;color:var(--ly-mid);text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ipp-ly-d.is-bad{color:var(--ly-salmon-ink);font-weight:600}
.ipp-ly-d.is-changed{color:var(--ly-ink);font-weight:600}

/* v1.0.6 — list tiles */
.ipp-ly-art.is-icon{color:var(--ly-ink)}
.ipp-ly-art.is-k-greeting{color:var(--ly-k-gr-ink);background:radial-gradient(circle at 0 100%,transparent 9px,var(--ly-k-gr-line) 9px,var(--ly-k-gr-line) 10px,transparent 10px) 0 0/18px 18px,var(--ly-k-gr-bg)}
.ipp-ly-art.is-k-event{color:var(--ly-k-ev-ink);background:repeating-linear-gradient(135deg,var(--ly-k-ev-line) 0 1px,transparent 1px 7px),var(--ly-k-ev-bg)}
.ipp-ly-art.is-k-re{color:var(--ly-k-re-ink);background:radial-gradient(var(--ly-k-re-line) 1.2px,transparent 1.4px) 0 0/7px 7px,var(--ly-k-re-bg)}
.ipp-ly-disc{width:28px;height:28px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 2px rgba(30,42,58,.12)}
.ipp-ly-disc svg{width:17px;height:17px}

/* the ad inside an article */
.ipp-ly-strip{display:grid;grid-template-columns:72px minmax(0,1fr);gap:0 8px;align-items:center;height:26px;margin-bottom:4px}
.ipp-ly-sa{display:flex;justify-content:center}
.ipp-ly-st{min-width:0;font-size:11px;color:#3A4558;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ipp-ly-st.is-bad{color:var(--ly-salmon-ink);font-weight:600}

/* the open tile: review only (v1.0.7) */
.ipp-ly-open{border-top:1px solid var(--ly-sand);margin:0 10px;padding:10px 0 12px;display:flex;flex-direction:column;gap:10px}
.ipp-ly-card2{display:grid;grid-template-columns:112px minmax(0,1fr);gap:0 14px;align-items:start}
.ipp-ly-rp{display:block;width:112px;height:63px;object-fit:cover;border-radius:4px;background:#F6F3EA}
.ipp-ly-rp.is-missing,.ipp-ly-bp.is-missing{display:flex;align-items:center;justify-content:center;box-sizing:border-box;border:1.5px dashed var(--ly-salmon);
  color:var(--ly-salmon-ink);font-size:11px;font-weight:600;background:#fff}
.ipp-ly-rg{min-width:0;display:grid;grid-template-columns:64px minmax(0,1fr);gap:3px 10px;align-items:baseline}
.ipp-ly-rn{grid-column:1 / -1;font-size:13px;font-weight:600;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ipp-ly-rk{font:600 9px var(--ix-font-body,'DM Sans',sans-serif);letter-spacing:.1em;text-transform:uppercase;color:var(--ly-mid)}
.ipp-ly-rv{min-width:0;font-size:12px;line-height:1.4;color:#3A4558}
.ipp-ly-miss{color:var(--ly-salmon-ink);font-weight:600}
.ipp-ly-banbig{max-width:100%}
.ipp-ly-bp{display:block;max-width:100%;height:auto;border-radius:3px}
.ipp-ly-bp.is-missing{width:300px;height:40px}

/* the right column: design dropdown and Cancel (v1.0.7) */
.ipp-ly-rc{height:56px;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:3px;min-width:0}
.ipp-ly-dsel,.ipp-ly-tsel{box-sizing:border-box;height:26px;border:1.5px solid var(--ix-border-input,#DDD9C8);border-radius:6px;background:#fff;
  color:var(--ly-ink);cursor:pointer;-webkit-appearance:none;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5'%3E%3Cpath d='M0 0l4 5 4-5z' fill='%235A6478'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 7px center}
.ipp-ly-dsel{width:150px;padding:0 20px 0 8px;font:500 11px var(--ix-font-body,'DM Sans',sans-serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ipp-ly-tsel{width:44px;height:22px;padding:0 13px 0 5px;font:600 9px var(--ix-font-mono,'DM Mono',ui-monospace,monospace);background-position:right 4px center;background-color:var(--ly-sand);border-color:transparent}
.ipp-ly-dsel:hover,.ipp-ly-tsel:hover{border-color:#B9B2A0}
.ipp-ly-dsel:focus-visible,.ipp-ly-tsel:focus-visible{outline:2px solid var(--ly-ink);outline-offset:1px}
.ipp-ly-dsel.is-bad{border-color:var(--ly-salmon);color:var(--ly-salmon-ink)}
.ipp-ly-dsel.is-changed,.ipp-ly-tsel.is-changed{border:2px solid var(--ly-gold);background-color:#FBF4E2;font-weight:700}
.ipp-ly-tsel.is-none{border-color:var(--ly-salmon);color:var(--ly-salmon-ink);background-color:#fff}
.ipp-ly-dsel:disabled,.ipp-ly-tsel:disabled{cursor:default;opacity:.6}
.ipp-ly-dtx{font-size:11px;color:var(--ly-mid)}
.ipp-ly-dtx.is-bad{color:var(--ly-salmon-ink);font-weight:600}
.ipp-ly-cx{border:0;background:none;padding:0;font:500 11px var(--ix-font-body,'DM Sans',sans-serif);color:var(--ly-mid);
  text-decoration:underline;text-underline-offset:2px;cursor:pointer;line-height:1}
.ipp-ly-cx:hover{color:var(--ly-ink)}
.ipp-ly-tile .ipp-ly-rm{font-size:11px}

.ipp-ly-msg{font-size:12px;color:var(--ly-mid)}
.ipp-ly-msg.is-bad{color:var(--ly-salmon-ink);font-weight:600}
.ipp-ly-drop{position:absolute;left:4px;right:4px;height:3px;border-radius:2px;background:var(--ly-ink);pointer-events:none;z-index:2}

/* side cards */
.ipp-ly-card{box-sizing:border-box;background:#fff;border-radius:12px;border:1px solid var(--ly-border);padding:16px 18px}
.ipp-ly-card p{margin:6px 0 0;font-size:13px;line-height:1.45;color:var(--ly-mid)}
.ipp-ly-k{font:600 10px var(--ix-font-body,'DM Sans',sans-serif);letter-spacing:.12em;text-transform:uppercase;color:var(--ly-mid)}

/* Before Publish */
.ipp-ly-check{border:1.5px solid var(--ly-salmon)}
.ipp-ly-check.is-ok{border:1px solid #B9DCCB;background:#F3FAF6}
.ipp-ly-check.is-ok p{color:var(--ix-ok,#1F7A5C)}
.ipp-ly-check ul{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.ipp-ly-check li button{display:flex;gap:10px;align-items:flex-start;width:100%;text-align:left;border:0;background:none;padding:2px 0;
  font:400 13px/1.4 var(--ix-font-body,'DM Sans',sans-serif);color:var(--ly-ink);cursor:pointer}
.ipp-ly-check li button::before{content:"";width:8px;height:8px;border-radius:4px;background:var(--ly-salmon);flex:none;margin-top:5px}
.ipp-ly-check li button:hover{text-decoration:underline;text-underline-offset:2px}

/* tray: Layout's own (.ipp-ly-bar), placed like the shell's .ipp-savebar */
.ipp-ly-bar{position:absolute;left:var(--ipp-b-rail,290px);right:0;bottom:0;height:56px;z-index:20;box-sizing:border-box;
  display:flex;align-items:center;gap:16px;padding:0 28px;background:#fff;border-top:1px solid var(--ix-border,#E4E0D4);
  box-shadow:0 -6px 22px -10px rgba(30,42,58,.18);font-family:var(--ix-font-body,'DM Sans',system-ui,sans-serif)}
.ipp-ly-bar .dot{width:8px;height:8px;border-radius:50%;background:var(--ix-text-light,#6B7280);flex:none}
.ipp-ly-bar .stat{font-size:13px;color:var(--ix-text-mid,#5A6478);white-space:nowrap}
.ipp-ly-bar.ipp-dirty{border-top:2px solid var(--ix-gold,#C4A35A)}
.ipp-ly-bar.ipp-dirty .dot,.ipp-ly-bar.saving .dot{background:var(--ix-gold,#C4A35A);box-shadow:0 0 0 4px var(--ix-gold-shadow,rgba(196,163,90,.2))}
.ipp-ly-bar.ipp-dirty .stat{color:var(--ix-text-dark,#1E2A3A);font-weight:600}
.ipp-ly-actions{margin-left:auto;display:inline-flex;align-items:center;gap:14px}
.ipp-ly-actions [hidden]{display:none!important}
.ipp-ly-ed{font-size:13px;color:var(--ix-text-mid,#5A6478);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:520px}

/* the rail's Layout tab: fit / total and the salmon dot */
.ipp-switcher button.ipp-ly-tab{display:flex;align-items:center}
.ipp-switcher button.ipp-ly-tab .ipp-ly-tabname{flex:1;text-align:left}
.ipp-switcher button.ipp-ly-tab .ipp-ly-tabn{font:500 12px var(--ix-font-mono,'DM Mono',ui-monospace,monospace);opacity:.9}
.ipp-switcher button.ipp-ly-tab .ipp-ly-tabdot{width:8px;height:8px;border-radius:4px;background:var(--ix-rail-alert,#F08A73);margin-left:8px;flex:none}
.ipp-switcher button.ipp-ly-tab .ipp-ly-tabdot[hidden]{display:none}

/* the weather tile (v1.0.3, on tiles) */
.ipp-ly-tile.is-wx-bad{background:#FDEEEA;border-color:var(--ly-salmon)}
.ipp-ly-tile.is-wx-bad .ipp-ly-s{color:var(--ly-salmon-ink);font-weight:600}
.ipp-ly-tile.is-wx-ok{border-left:4px solid var(--ix-ok,#1F7A5C)}
.ipp-ly-rm{border:0;background:none;padding:0;font:600 12px var(--ix-font-body,'DM Sans',system-ui,sans-serif);color:var(--ix-danger,#B42318);text-decoration:underline;cursor:pointer;white-space:nowrap}
.ipp-ly-rm:hover{text-decoration-thickness:2px}
.ipp-ly-wx{margin:0;padding:8px 10px;border-radius:8px;font-size:12px;line-height:1.45}
.ipp-ly-wx.is-bad{background:#FDEEEA;color:var(--ly-salmon-ink)}
.ipp-ly-wx.is-ok{background:#E9F6EF;color:var(--ix-ok,#1F7A5C)}
.ipp-ly-wx.is-wait{background:var(--ly-cream);color:var(--ly-mid)}

/* v1.0.4 — heads up */
.ipp-ly-k--hu{margin-top:14px}
.ipp-ly-check .ipp-ly-hu li button{color:var(--ly-mid)}
.ipp-ly-check .ipp-ly-hu li button::before{background:var(--ly-mid)}

/* v1.0.9 — Preview */
.ipp-ly-pv{flex:1;min-height:320px;display:flex;flex-direction:column;gap:8px;padding:12px 14px}
.ipp-ly-pvh{display:flex;align-items:center;gap:10px;flex:none}
.ipp-ly-pvt{font-size:12px;color:var(--ly-mid);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.ipp-ly-seg{display:inline-flex;gap:2px;padding:3px;border-radius:8px;background:#E7E2D4;flex:none}
.ipp-ly-seg button{box-sizing:border-box;height:26px;border:0;background:transparent;font:600 11px var(--ix-font-body,'DM Sans',sans-serif);
  color:var(--ly-mid);padding:0 10px;border-radius:6px;cursor:pointer}
.ipp-ly-seg button[aria-pressed="true"]{background:#fff;color:var(--ly-ink);box-shadow:0 1px 2px rgba(30,42,58,.12)}
.ipp-ly .ix-btn.ipp-ly-pvgo{flex:none;height:30px;padding:0 14px;font-size:13px}
.ipp-ly-pvnote{flex:none;margin:0;padding:8px 10px;border-radius:8px;font-size:12px;line-height:1.45}
.ipp-ly-pvnote.is-behind{background:#FBF4E2;border:1.5px solid var(--ly-gold);color:var(--ly-ink)}
.ipp-ly-pvnote.is-bad{background:#FDEEEA;border:1.5px solid var(--ly-salmon);color:var(--ly-salmon-ink)}
.ipp-ly-panes{flex:1;min-height:0;display:flex;gap:12px}
.ipp-ly-pane{flex:1 1 0;min-width:0;min-height:0;display:flex;flex-direction:column;gap:4px}
.ipp-ly-panes[data-split="email"] .ipp-ly-pane[data-pv="web"],
.ipp-ly-panes[data-split="web"] .ipp-ly-pane[data-pv="email"]{display:none}
.ipp-ly-pnh{flex:none;display:flex;align-items:center;height:20px;font:600 11px var(--ix-font-body,'DM Sans',sans-serif)}
.ipp-ly-pnh span:first-child{flex:1}
.ipp-ly-pnm{font:500 10px var(--ix-font-mono,'DM Mono',ui-monospace,monospace);color:var(--ly-mid)}
.ipp-ly-pvs{flex:1;min-height:0;overflow:auto;background:#E9E5DA;border:1px solid var(--ix-border-input,#DDD9C8);border-radius:8px}
.ipp-ly-pvs::-webkit-scrollbar{width:8px}
.ipp-ly-pvs::-webkit-scrollbar-thumb{background:var(--ix-border-input,#DDD9C8);border-radius:4px}
.ipp-ly-pvz{position:relative;overflow:hidden}
.ipp-ly-pvf{display:block;border:0;background:#fff;transform-origin:0 0}
.ipp-ly-pvempty{margin:0;padding:24px 16px;font-size:12px;line-height:1.45;color:var(--ly-mid);text-align:center}
.ipp-ly-pvempty.is-bad{color:var(--ly-salmon-ink);font-weight:600}
.ipp-ly-pvsel{flex:none;margin:0;font-size:12px;color:var(--ly-salmon-ink);font-weight:600}
.ipp-ly-pvsel[hidden]{display:none}
.ipp-ly-pvfoot{flex:none;margin:0;font-size:11px;color:var(--ly-mid)}

/* v1.0.10 — Before Publish only when needed */
.ipp-ly-chk:empty{display:none}
.ipp-ly-check.is-note{border:1px solid var(--ly-border);background:#fff;padding:12px 16px}

/* v1.0.11 — an empty article block is open (ipp-layout-v1.0.20.js) */
.ipp-ly-type.is-open{width:auto;min-width:32px;padding:0 5px;background:#fff;box-shadow:none;outline:1.5px dashed #B9B2A2;outline-offset:-1.5px;color:var(--ly-mid)}
.ipp-ly-dtx.is-off{color:var(--ly-mid);font-style:normal}

/* ── v1.0.12 · the weather tile's line wraps, led by its state pill ── */
.ipp-ly-tile.is-wx .ipp-ly-grid1{height:auto;min-height:56px;align-items:start}
.ipp-ly-tile.is-wx .ipp-ly-art{margin-top:8px}
.ipp-ly-tile.is-wx .ipp-ly-tx{padding:9px 0}
.ipp-ly-l2.is-wx{height:auto;align-items:start;grid-template-columns:minmax(0,1fr)}
.ipp-ly-l2.is-wx .ipp-ly-ecs,.ipp-ly-l2.is-wx .ipp-ly-fr{display:none}
.ipp-ly-s.is-wrap{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.4}
.ipp-ly-tile.is-wx-bad .ipp-ly-s.is-wrap{font-weight:500}
.ipp-ly-wxpill{display:inline-block;box-sizing:border-box;width:104px;height:16px;line-height:16px;margin:-1px 8px 0 0;padding:0 7px;border-radius:8px;vertical-align:top;
  font:600 10px/16px var(--ix-font-mono,'DM Mono',ui-monospace,monospace);letter-spacing:.04em;text-transform:uppercase;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff}
.ipp-ly-wxpill.is-ok{background:var(--ix-ok,#1F7A5C)}
.ipp-ly-wxpill.is-bad{background:var(--ly-salmon)}
.ipp-ly-wxpill.is-wait{background:var(--ly-mid,#7A8294)}

/* ── v1.0.13 · Remove on every tile ─────────────────────────────── */
.ipp-ly-links{display:inline-flex;align-items:center;gap:10px;height:14px}
.ipp-ly-links:empty{display:none}
.ipp-ly-tile .ipp-ly-rm{font-size:11px;font-weight:500}
.ipp-ly-tile .ipp-ly-rm.is-off{color:var(--ly-mid);text-decoration-style:dotted;cursor:help}
.ipp-ly-tile .ipp-ly-rm.is-off:hover{text-decoration-thickness:1px}
.ipp-ly-tile.is-removing{border-color:var(--ix-changed-border,#C4A35A)}

/* ── v1.0.14 · pairs, Add, less on the tile ─────────────────────────── */
.ipp-ly-art.is-clear{background:transparent}
.ipp-ly-tile.is-banner .ipp-ly-art.is-clear{background:transparent}
/* the frame, as the Default Layout draws it: 1px edge, teal left edge, cream ground; the group indented inside */
.ipp-ly-pair{flex:none;display:flex;flex-direction:column;gap:5px;box-sizing:border-box;padding:0 4px 4px;border:1px solid var(--ly-border);border-left:3px solid var(--ix-teal,#1A3A3A);border-radius:9px;background:#FDFCF8}
.ipp-ly-pair.is-dragging{opacity:.45}
.ipp-ly-pair>.ipp-ly-tile.is-opener{border-width:0 0 1px;border-radius:7px 7px 0 0;margin:0 -4px}
.ipp-ly-pair>.ipp-ly-tile.is-opener.ipp-dirty{border-width:0 0 2px;margin:0 -4px}
.ipp-ly-pair>.ipp-ly-tile.is-opener.is-open{box-shadow:inset 0 0 0 2px var(--ly-ink)}
.ipp-ly-tile.is-inside{margin-left:18px}
.ipp-ly-tile.is-inside.ipp-dirty{margin-left:17px}
.ipp-ly-tile.is-end{background:transparent;border-style:dashed}
.ipp-ly-tile.is-end.ipp-dirty{border-style:solid}
.ipp-ly-tile.is-end .ipp-ly-tr{padding-right:10px}
.ipp-ly-main.is-end{cursor:default}
.ipp-ly-t.is-endt{color:var(--ly-mid);font-weight:500;font-style:italic}
.ipp-ly-tile.is-new{border:2px solid var(--ly-gold);margin:-1px}
.ipp-ly-tile.is-new .ipp-ly-s{color:var(--ly-ink);font-weight:600}
/* the Add row: a fixed 40px row under the stack, 110px buttons, labels truncate */
.ipp-ly-addrow{flex:none;display:flex;align-items:center;gap:8px;height:40px;margin-top:6px;padding:0 10px 0 7px}
.ipp-ly-addk{flex:none;width:32px;font:600 10px var(--ix-font-body,'DM Sans',sans-serif);letter-spacing:.12em;text-transform:uppercase;color:var(--ly-mid)}
.ipp-ly-addb{flex:none;box-sizing:border-box;width:110px;height:28px;padding:0 10px;border:1.5px solid var(--ix-border-input,#DDD9C8);border-radius:6px;background:#fff;
  font:600 11px var(--ix-font-body,'DM Sans',sans-serif);color:var(--ly-ink);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ipp-ly-addb:hover{border-color:var(--ly-ink)}
.ipp-ly-addb:focus-visible{outline:2px solid var(--ly-ink);outline-offset:1px}
.ipp-ly-addb:disabled{opacity:.5;cursor:default}
/* a pending tile (new, or waiting to be removed) says so on its full second line: the franchise column is not drawn */
.ipp-ly-tile.is-new .ipp-ly-l2,.ipp-ly-tile.is-removing .ipp-ly-l2{grid-template-columns:24px minmax(0,1fr)}
.ipp-ly-tile.is-new .ipp-ly-fr,.ipp-ly-tile.is-removing .ipp-ly-fr{display:none}

/* v1.0.15 — the position number on a Before Publish / Heads up line, as on the tile */
.ipp-ly-check li button .ipp-ly-n{flex:none;width:22px;text-align:right;margin-right:4px;font:500 12px var(--ix-font-mono,'DM Mono',ui-monospace,monospace);color:var(--ly-mid)}

/* ── v1.0.17 · the group is a panel ─────────────────────────────────── */
.ipp-ly-pair{--ly-pair:#A9C3BF;--ly-pair-bg:#E9F1EF;--ly-pair-ink:var(--ix-teal,#1A3A3A);flex:none;display:flex;flex-direction:column;gap:6px;box-sizing:border-box;margin:0;padding:0 10px 0 7px;border:1px solid var(--ly-pair);border-left:3px solid var(--ly-pair-ink);border-radius:10px;background:var(--ly-pair-bg)}
.ipp-ly-pair.is-dragging{opacity:.45}
.ipp-ly-pair>.ipp-ly-tile{border-radius:8px}
.ipp-ly-pair>.ipp-ly-tile.is-inside{margin:0}
.ipp-ly-pair>.ipp-ly-tile.is-inside.ipp-dirty{margin:-1px}
.ipp-ly-ghead,.ipp-ly-gfoot{margin:0 -10px 0 -7px!important;border:0!important;background:transparent!important;border-radius:0!important;box-shadow:none!important}
.ipp-ly-ghead .ipp-ly-brow{display:grid;grid-template-columns:14px 18px 44px minmax(0,1fr) 150px auto;align-items:center;column-gap:8px;height:36px;padding:0 10px 0 4px}
.ipp-ly-gfoot .ipp-ly-brow{display:grid;grid-template-columns:14px minmax(0,1fr) auto;align-items:center;column-gap:10px;height:22px;padding:0 10px 0 4px}
.ipp-ly-ghead .ipp-ly-brow>.ipp-ly-pos,.ipp-ly-ghead .ipp-ly-brow>.ipp-ly-tc{height:auto;display:flex;align-items:center}
.ipp-ly-ghead .ipp-ly-h{height:36px;width:14px}
.ipp-ly-gfoot .ipp-ly-h{height:22px;width:14px}
.ipp-ly-gl{font:600 11px var(--ix-font-mono,'DM Mono',ui-monospace,monospace);letter-spacing:.14em;text-transform:uppercase;color:var(--ly-pair-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ipp-ly-gl.is-end{color:#5C7F7A;font-weight:500;letter-spacing:.12em}
.ipp-ly-gs{margin-left:12px;font-weight:500;letter-spacing:.06em;text-transform:none;color:var(--ly-mid)}
.ipp-ly-gr{height:1px;background:var(--ly-pair)}
.ipp-ly-ghead .ipp-ly-bd{display:flex;justify-content:flex-end}
.ipp-ly-ghead .ipp-ly-bd .ipp-ly-dsel{width:150px}
.ipp-ly-ghead .ipp-ly-links{margin:0;justify-content:flex-end;min-width:48px}
.ipp-ly-ghead.ipp-dirty .ipp-ly-gl,.ipp-ly-gfoot.ipp-dirty .ipp-ly-gl{color:var(--ly-gold-ink,#8A6D1F)}
.ipp-ly-pair:has(>.ipp-ly-ghead.ipp-dirty){border-color:var(--ly-gold);border-left-color:var(--ly-gold)}
.ipp-ly-ghead.is-failed .ipp-ly-gl{color:var(--ly-bad)}