.post-preview{--preview-line:#e3e1dd;--preview-ink:#252522;box-sizing:border-box;width:min(1240px,calc(100vw - 64px));max-width:none;max-height:calc(100dvh - 64px);padding:0;border:1px solid var(--preview-line);border-radius:14px;background:#fff;color:var(--preview-ink);box-shadow:0 24px 100px #0004;font-family:inherit;overflow:auto;overscroll-behavior:contain}.post-preview::backdrop{background:rgb(18 20 19 / .78)}.post-preview *{box-sizing:border-box}.post-preview-top{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 22px;border-bottom:1px solid var(--preview-line)}.post-preview-heading{font-size:15px;line-height:1.4;font-weight:700;letter-spacing:0;margin:0}.post-preview-close,.post-preview-zoom{font:inherit;font-size:12px;font-weight:600;line-height:1.4;border:1px solid #d5d2cc;border-radius:6px;padding:10px 13px;background:#fff;color:var(--preview-ink);cursor:pointer;flex-shrink:0;min-height:38px}.post-preview-close:hover,.post-preview-zoom:hover{background:#f5f4f1}.post-preview :focus-visible{outline:3px solid #77746c;outline-offset:3px}.post-preview-zoom:disabled{opacity:.5;cursor:default}.post-preview-content{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,340px);min-height:320px}.post-preview-visual{min-width:0;background:#f1f1ee;display:flex;flex-direction:column}.post-preview-media{position:relative;display:flex;align-items:center;justify-content:center;min-height:220px;min-width:0;flex:1;overflow:auto;overscroll-behavior:contain}.post-preview-image{position:absolute;inset:0;display:block;width:auto;height:auto;max-width:100%;max-height:100%;margin:auto;object-fit:contain}.post-preview-media.is-original{display:block}.post-preview-media.is-original .post-preview-image{position:static;margin:0;max-width:none;max-height:none;width:auto;height:auto}.post-preview-loading{font-size:13px;line-height:1.6;text-align:center;padding:28px;margin:0}.post-preview-media:has(.post-preview-image) .post-preview-loading{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}.post-preview-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-top:1px solid var(--preview-line);background:#fff}.post-preview-size{font-size:11px;color:#66645f;margin:0;text-align:right}.post-preview-copy{border-left:1px solid var(--preview-line);padding:24px;overflow:auto;overscroll-behavior:contain;min-width:0}.post-preview-identity{display:flex;flex-direction:column;gap:5px;border-bottom:1px solid var(--preview-line);padding-bottom:20px;margin-bottom:22px}.post-preview-brand{font-size:15px;font-weight:700;line-height:1.5;overflow-wrap:anywhere}.post-preview-title{font-size:11px;line-height:1.5;color:#66645f;overflow-wrap:anywhere}.post-preview-caption{font-size:14px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere;margin:0}.post-preview-tags{font-size:13px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere;margin:20px 0 0;color:#525e64}.post-preview-trigger{display:block;position:relative;width:100%;padding:0;border:0;border-radius:3px;background:transparent;font:inherit;text-align:inherit;cursor:zoom-in;overflow:hidden}.post-preview-trigger:focus-visible{outline:3px solid currentColor;outline-offset:3px}.post-preview-trigger>span{display:block;padding:8px 10px;background:#fff;color:#48443f;font:600 12px/1.4 system-ui,sans-serif;text-align:center;border-top:1px solid #e7e2dc}.post-preview-trigger:disabled{cursor:wait}.post-preview-trigger:disabled>span{color:#777}.post-preview-trigger:hover>span{background:#f5f4f1}@media(max-width:760px){.post-preview{width:calc(100vw - 20px);max-height:calc(100dvh - 20px);border-radius:10px}.post-preview-top{padding:14px;gap:12px;align-items:start}.post-preview-close{font-size:11px;padding:8px 10px}.post-preview-content{display:block}.post-preview-media{flex:none;height:55dvh;min-height:0}.post-preview-copy{border-left:0;border-top:1px solid var(--preview-line);padding:20px;max-height:none;overflow:visible}.post-preview-tools{padding:10px 12px}.post-preview-zoom{font-size:11px;padding:8px 10px;min-height:36px}.post-preview-size{font-size:10px}.post-preview-identity{padding-bottom:14px;margin-bottom:16px}}
.post-preview-identity{flex-direction:row;align-items:center;gap:12px}.post-preview-names{display:flex;flex-direction:column;gap:2px;min-width:0}.post-preview-avatar{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#eceae6;color:#3a3833;font-size:16px;font-weight:700;line-height:1}.post-preview-title{font-size:13px;color:#57544e}.post-preview-tags{color:var(--ink,#29211c)}.post-preview-size{font-size:12px}
@media(max-width:760px){.post-preview-close,.post-preview-zoom{font-size:12px;min-height:40px}.post-preview-size{font-size:12px}.post-preview-avatar{width:34px;height:34px;font-size:14px}}
.post-preview-steps{display:flex;align-items:center;justify-content:center;gap:14px;padding:10px 16px;border-top:1px solid var(--preview-line);background:#fff}.post-preview-step{font:inherit;font-size:12px;font-weight:600;line-height:1.4;border:1px solid #d5d2cc;border-radius:6px;padding:9px 13px;background:#fff;color:var(--preview-ink);cursor:pointer;min-height:38px}.post-preview-step:hover{background:#f5f4f1}.post-preview-count{margin:0;min-width:56px;font-size:12px;color:#57544e;text-align:center;font-variant-numeric:tabular-nums}
.post-preview-video{position:absolute;inset:0;display:block;max-width:100%;max-height:100%;margin:auto;background:#000}.post-preview-label{margin:18px 0 6px;font-size:12px;font-weight:650;line-height:1.4;letter-spacing:0;color:#57544e}.post-preview-identity+.post-preview-label{margin-top:0}
.post-preview-approve{display:block;width:100%;min-height:44px;margin-top:24px;padding:11px 16px;font:inherit;font-size:14px;font-weight:650;line-height:1.4;border:1px solid var(--brand-action,#252522);border-radius:7px;background:var(--brand-action,#252522);color:#fff;cursor:pointer}.post-preview-approve:hover{background:var(--brand-hover,#000);border-color:var(--brand-hover,#000)}
@media(max-width:760px){.post-preview-steps{padding:8px 12px}}
.post-preview-feedback{margin:0;font-size:14px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere}.post-preview-approve:disabled,.post-preview-approve:disabled:hover{opacity:.55;cursor:not-allowed;background:var(--brand-action,#252522);border-color:var(--brand-action,#252522)}
/* One media box for the whole post, so Previous, Next and Approve keep their place from slide to slide. On wider screens
   the viewer is as tall as the window allows and the box takes what the bars leave; on phones the box is 55% of the
   window, leaving room for the caption and Approve. Each visual sits letterboxed in its middle. The tools bar keeps its
   height when View at original size isn't offered (the shell hides [hidden] with !important). */
@media(min-width:761px){.post-preview[open]{display:flex;flex-direction:column;height:calc(100dvh - 64px)}.post-preview-top{flex:none}.post-preview-content{flex:1;min-height:0;grid-template-rows:minmax(0,1fr)}}
.post-preview-steps,.post-preview-tools{flex:none}.post-preview-zoom[hidden]{display:block!important;visibility:hidden}
/* The caption scrolls in its own area; Approve occupies a separate footer, so it stays reachable and never covers text. */
.post-preview-copy{display:flex;flex-direction:column;min-height:0;overflow:hidden}.post-preview-text{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding-bottom:4px}.post-preview-approve{flex:none;margin-top:16px}
@media(max-width:760px){.post-preview[open]{display:flex;flex-direction:column;height:calc(100dvh - 20px)}.post-preview-top{flex:none}.post-preview-content{display:flex;flex-direction:column;flex:1;min-height:0}.post-preview-visual{flex:none}.post-preview-copy{flex:1;min-height:0;padding:16px}.post-preview-approve{margin-top:12px}}