/* ta-asf-article-v1.0.7.css */
/* ============================================================
   ta-asf-article-v1.0.7.css
   v1.0.7 (13 Oct) — "Where it runs" (ta-asf-article v1.0.9). Appended
   at the end; nothing above changed. Spec:
   inbxify-asf-where-it-runs-mockup-v0_1.html. Jeff asked for the
   mockup's sizes and compactness: facts-column labels sit left of
   their fields, labels are 11px body font, group heads 11px.
   v1.0.6 (8 Oct) — the print panel (Compare with print, ta-asf v1.11.8
   + ta-asf-article v1.0.7). Appended at the end; nothing above changed.
   INBXIFY TA Studio — the reordered Article ASF (edit and create)

   SOURCE OF TRUTH: inbxify-asf-mockup-v0_10.html (build spec,
   24 Sept 2026). Every rule below is copied from that mockup
   unchanged. If the page and the mockup disagree, the mockup is
   right and this file or the JS is wrong.

   SCOPE: Articles only. Ads, Events and RE keep using
   ta-asf-v1.6.4.css + ta-asf-layout-v1.8.2.css until their own
   redesign. Nothing here matches an .asf-* class, so the two sets
   cannot collide.

   ROOT MARKUP the JS must emit:
     <div class="asf2 ix-dense ix-surface-scope"> … </div>
   Both extra classes are required:
     ix-surface-scope  clears the section.publisher-wrapper *
                       wildcard for everything inside (ix-tokens)
     ix-dense          compact sizes (ix-form-controls v1.1.0)

   ARMOR: every rule is scoped .asf2[class] … so it outranks the
   wildcard (0,1,1) and the surface-scope reset (0,2,0). Every
   background carries !important. Do not drop the [class] or the
   .asf2 prefix: the mockup proves the form looks identical with
   the wildcard on and off only because of them.

   COLUMN COLOURS (ruled 24 Sept): facts teal · words blue ·
   images green. Gold is never a column colour: gold means a
   pending edit.

   MULTI-TENANT: no publisher or title values. Tokens only.

   v1.0.5 (24 Sept) — the body section as v1.10.0 had it (with
   ta-asf-article-v1.0.3.js): Body row with the raw-text links, the
   toolbar pinned while the body scrolls, the body typed like the
   published page (Spectral 18/1.95, Fraunces 28/24/22 — values copied
   from ta-asf-v1.6.4.css), no height cap, and the character count
   under the editor. Earlier body typography rules are replaced below.

   v1.0.4 (24 Sept) — rules for Trix's full default toolbar, which
   ta-asf-article v1.0.2 restores (v1.10.0 behaviour). Groups wrap on
   one bar, the active-button tint survives ix-surface-scope, and
   headings H1 / H2 / H3 read as three sizes. Needs
   ta-asf-article-v1.0.2.js.

   v1.0.3 (24 Sept) — Facts column (left) half again as wide:
   260px → 390px, and 240px → 360px under 1180px wide. Nothing else
   changed.

   v1.0.2 (24 Sept) — Main and OG previews show the whole photo at
   full height (ruled after the first live test). v1.0.1 cropped both
   to a 96px strip. Nothing else changed.

   v1.0.1 (24 Sept) — v1.0.0 unchanged, plus rules for what the
   build renders that the mockup only imitated:
     · real photos: <img class="asf2-imgfill"> inside every picture
       box. ix-surface-scope strips background-image (!important), so
       a photo can never be a CSS background here.
     · the body editor: Trix inside .asf2-body, its dialogs and its
       active-button state, typed like the mockup's body.
     · Sponsor OK / Edit pass tick buttons and "cancel body": the
       mockup set these with inline styles; the build may not.
     · a loading line, and the notice ta-asf shows when this module
       is missing.

   LOAD ORDER (after these):
     ix-tokens-v1.0.4.css · ix-buttons-v1.0.6.css ·
     ix-form-controls-v1.1.0.css · ix-ai-badge-v1.0.0.css
   ============================================================ */

/* ════════════════════════════════════════════════════════════
   LAYOUT, COLUMNS, BODY, IMAGES, AI STRIP
   Tokens only. No colour or size literals outside the ix set.
   ARMOR: the ASF root carries ix-surface-scope (ix-tokens v1.0.4),
   which clears the wildcard for everything inside. Every rule here is
   root-scoped as .asf2[class] ... so it outranks both the wildcard
   (0,1,1) and the surface-scope reset (0,2,0). Backgrounds carry
   !important. Do not drop the [class] or the root prefix.
   ════════════════════════════════════════════════════════════ */
.asf2[class] *,.asf2[class] *::before,.asf2[class] *::after{box-sizing:border-box;}
.asf2.ix-surface-scope[class]{background:var(--ix-surface) !important;border:1px solid var(--ix-border);border-radius:var(--ix-radius-sm);box-shadow:var(--ix-shadow-sm);overflow:clip;font-family:var(--ix-font-body);font-size:12px;line-height:1.45;color:var(--ix-text-dark);}

.asf2[class] .asf2-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:7px 12px;background:var(--ix-teal) !important;color:var(--ix-text-invert);}
.asf2[class] .asf2-crumb{font-family:var(--ix-font-mono);font-size:10.5px;color:var(--ix-rail-text);white-space:nowrap;}
.asf2[class] .asf2-crumb b{color:var(--ix-text-invert);font-weight:500;}
.asf2[class] .asf2-ticks{display:flex;gap:4px;flex-wrap:wrap;}
.asf2[class] .asf2-tick{font-family:var(--ix-font-mono);font-size:9.5px;padding:2px 7px;border-radius:999px;background:rgba(255,255,255,.08) !important;color:var(--ix-danger-light);white-space:nowrap;}
.asf2[class] .asf2-tick.ok{color:var(--ix-ok-light);}
.asf2[class] .asf2-bar-right{margin-left:auto;display:flex;align-items:center;gap:10px;}
.asf2[class] .asf2-bar .ix-revert{color:var(--ix-rail-text) !important;}
.asf2[class] .asf2-bar .ix-revert:hover:not(:disabled){color:var(--ix-text-invert) !important;}
.asf2[class] .asf2-bar .ix-revert:disabled{opacity:.35 !important;}
.asf2[class] .asf2-dirtycount{font-family:var(--ix-font-mono);font-size:10px;color:var(--ix-gold-bright);white-space:nowrap;}

.asf2[class] .asf2-grid{display:grid;grid-template-columns:390px minmax(0,1fr) 300px;align-items:start;}
.asf2[class] .asf2-col{padding:10px 12px;display:flex;flex-direction:column;gap:9px;min-width:0;}
.asf2[class] .asf2-col + .asf2-col{border-left:1px solid var(--ix-border-soft);}
.asf2[class] .asf2-col--facts{background:var(--ix-cream-warm) !important;}
.asf2[class] .asf2-col--tray{background:var(--ix-cream) !important;position:sticky;top:0;}
@media (max-width:1180px){.asf2[class] .asf2-grid{grid-template-columns:360px minmax(0,1fr);}.asf2[class] .asf2-col--tray{grid-column:1 / -1;border-left:0;border-top:1px solid var(--ix-border-soft);position:static;}}
@media (max-width:760px){.asf2[class] .asf2-grid{grid-template-columns:1fr;}.asf2[class] .asf2-col + .asf2-col{border-left:0;border-top:1px solid var(--ix-border-soft);}}

.asf2[class] .asf2-group{display:flex;flex-direction:column;gap:6px;}
.asf2[class] .asf2-group-head{font-family:var(--ix-font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:500;display:flex;align-items:center;gap:7px;
  padding:4px 8px;margin:0 -4px 2px;border-radius:var(--ix-radius-sharp);
  background:var(--asf2-bed,var(--ix-teal-soft)) !important;color:var(--asf2-ink,var(--ix-teal));border-left:3px solid var(--asf2-accent,var(--ix-teal));}
.asf2[class] .asf2-group-head .n{display:inline-flex;align-items:center;justify-content:center;min-width:17px;height:17px;border-radius:999px;background:var(--asf2-accent,var(--ix-teal)) !important;color:var(--ix-text-invert);font-size:9.5px;letter-spacing:0;}
.asf2[class] .asf2-group-head .ix-revert{color:var(--asf2-ink,var(--ix-teal)) !important;}
/* Column accents: facts = teal, words = blue, images = green. Tokens only.
   Gold is NOT used as a column colour: gold means a pending edit. */
.asf2[class] .asf2-col--facts{--asf2-accent:var(--ix-teal);--asf2-ink:var(--ix-teal);--asf2-bed:var(--ix-teal-soft);}
.asf2[class] .asf2-col--words{--asf2-accent:var(--ix-blue-deep);--asf2-ink:var(--ix-blue-deep);--asf2-bed:var(--ix-blue-ghost);}
.asf2[class] .asf2-col--tray{--asf2-accent:var(--ix-ok);--asf2-ink:var(--ix-ok);--asf2-bed:color-mix(in srgb, var(--ix-ok) 10%, transparent);}
.asf2[class] .asf2-more summary{color:var(--ix-teal) !important;font-weight:500;}
.asf2[class] .asf2-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6px;}
.asf2[class] .asf2-readonly{font-size:12px;padding:4px 0;color:var(--ix-text-mid);}
.asf2[class] .asf2-readonly a{color:var(--ix-teal);}
.asf2[class] .asf2-more{border-top:1px dashed var(--ix-border-input);padding-top:6px;}
.asf2[class] .asf2-more summary{cursor:pointer;font-family:var(--ix-font-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ix-text-light);list-style:none;}
.asf2[class] .asf2-more summary::-webkit-details-marker{display:none;}
.asf2[class] .asf2-more summary::before{content:"▸ ";}
.asf2[class] .asf2-more[open] summary::before{content:"▾ ";}
.asf2[class] .asf2-more-body{display:flex;flex-direction:column;gap:6px;margin-top:6px;}
.asf2[class] .asf2-more,.asf2[class] .asf2-more-body,.asf2[class] .asf2-col .ix-field{min-width:0;max-width:100%;}
.asf2[class] .asf2-col .ix-picker-input{max-width:100% !important;}

.asf2[class] .asf2-headline.ix-picker-input{font-family:var(--ix-font-display) !important;font-size:19px !important;font-weight:600 !important;color:var(--ix-teal) !important;}
.asf2[class] .asf2-headline.ix-picker-input--changed{color:var(--ix-teal) !important;}

.asf2[class] .asf2-body{border:1px solid var(--ix-border-input);border-radius:var(--ix-radius-sharp);background:var(--ix-white) !important;}
.asf2[class] .asf2-body.is-changed{border:2px solid var(--ix-changed-border);box-shadow:var(--ix-shadow-gold);}
.asf2[class] .asf2-rtebar{display:flex;align-items:center;gap:4px;flex-wrap:wrap;padding:4px 6px;border-bottom:1px solid var(--ix-border-soft);background:var(--ix-cream-warm) !important;position:relative;}
.asf2[class] .asf2-rtebtn{font:inherit;font-size:11px;font-weight:600;min-width:24px;border:1px solid transparent;background:none !important;color:var(--ix-text-mid);border-radius:var(--ix-radius-sharp);padding:2px 6px;cursor:pointer;}
.asf2[class] .asf2-rtebtn:hover{border-color:var(--ix-border-input);background:var(--ix-white) !important;}
.asf2[class] .asf2-rtebtn--img{border-color:var(--ix-gold);color:var(--ix-gold-ink);background:var(--ix-gold-glow) !important;}
.asf2[class] .asf2-rtebtn--img:hover{background:var(--ix-gold) !important;color:var(--ix-teal-deep);}
.asf2[class] .asf2-rtehint{margin-left:auto;font-family:var(--ix-font-mono);font-size:9px;color:var(--ix-text-light);}
.asf2[class] .asf2-rte{padding:14px 18px;font-family:'Spectral',Georgia,serif;font-size:18px;line-height:1.95;color:var(--ix-text-dark);}
.asf2[class] .asf2-rte p{margin:0 0 8px;padding:1px 4px;border-radius:var(--ix-radius-sharp);cursor:text;border-left:2px solid transparent;}
.asf2[class] .asf2-rte p.is-cursor{border-left-color:var(--ix-blue);background:var(--ix-blue-ghost) !important;}

.asf2[class] .asf2-fig{display:flex;gap:8px;align-items:center;margin:2px 0 10px;padding:5px;border:1px solid var(--ix-border-soft);border-radius:var(--ix-radius-sharp);background:var(--ix-cream) !important;}
.asf2[class] .asf2-fig-thumb{width:64px;height:42px;border-radius:3px;flex:none;}
.asf2[class] .asf2-fig-meta{flex:1;min-width:0;font-size:11px;color:var(--ix-text-mid);}
.asf2[class] .asf2-fig-meta b{font-family:var(--ix-font-mono);font-size:10px;font-weight:500;color:var(--ix-teal);}
.asf2[class] .asf2-fig-cap{font-style:italic;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.asf2[class] .asf2-fig-x{font:inherit;font-size:13px;border:0;background:none !important;color:var(--ix-text-light);cursor:pointer;padding:0 4px;}
.asf2[class] .asf2-fig-x:hover{color:var(--ix-salmon-ink);}
.asf2[class] .asf2-num{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background:var(--ix-teal) !important;color:var(--ix-text-invert);font-family:var(--ix-font-mono);font-size:9px;font-weight:500;flex:none;}

.asf2[class] .asf2-pop{position:absolute;top:100%;left:6px;z-index:20;width:320px;background:var(--ix-white) !important;border:1px solid var(--ix-border);border-radius:var(--ix-radius-sm);box-shadow:var(--ix-shadow-lg);padding:8px;}
.asf2[class] .asf2-pop[hidden]{display:none;}
.asf2[class] .asf2-pop-head{font-family:var(--ix-font-mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--ix-text-light);margin-bottom:6px;display:flex;}
.asf2[class] .asf2-pop-head span{margin-left:auto;text-transform:none;letter-spacing:0;}
.asf2[class] .asf2-pop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;}
.asf2[class] .asf2-pop-item{font:inherit;border:1px solid var(--ix-border-soft);border-radius:var(--ix-radius-sharp);background:var(--ix-white) !important;padding:0;cursor:pointer;text-align:left;overflow:hidden;}
.asf2[class] .asf2-pop-item:hover,.asf2[class] .asf2-pop-item:focus-visible{border-color:var(--ix-gold);outline:none;box-shadow:var(--ix-shadow-gold);}
.asf2[class] .asf2-pop-item div{height:44px;}
.asf2[class] .asf2-pop-item span{display:block;font-family:var(--ix-font-mono);font-size:8.5px;color:var(--ix-text-mid);padding:3px 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.asf2[class] .asf2-pop-foot{margin-top:7px;display:flex;align-items:center;gap:8px;font-size:10.5px;color:var(--ix-text-light);}

/* tray */
.asf2[class] .asf2-tray-head{display:flex;align-items:baseline;gap:8px;}
.asf2[class] .asf2-tray-title{font-weight:600;font-size:12.5px;color:var(--ix-ok);}
.asf2[class] .asf2-tray-sum{font-family:var(--ix-font-mono);font-size:10px;color:var(--ix-text-mid);}
.asf2[class] .asf2-tray-sum .bad{color:var(--ix-salmon-ink);font-weight:500;}
.asf2[class] .asf2-roles{display:grid;grid-template-columns:1fr 1fr;gap:6px;}
.asf2[class] .asf2-roleslot{border:1px dashed var(--ix-border-input);border-radius:var(--ix-radius-sharp);background:var(--ix-white) !important;overflow:hidden;}
.asf2[class] .asf2-roleslot.is-changed{border:2px solid var(--ix-changed-border);}
.asf2[class] .asf2-roleslot-pic{height:96px;display:flex;align-items:center;justify-content:center;font-size:10.5px;color:var(--ix-text-light);}
.asf2[class] .asf2-roleslot-cap{display:flex;gap:5px;padding:3px 6px;font-family:var(--ix-font-mono);font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:var(--ix-text-light);border-top:1px solid var(--ix-border-soft);}
.asf2[class] .asf2-roleslot-cap b{font-weight:500;color:var(--ix-text-mid);}
.asf2[class] .asf2-roleslot-cap em{margin-left:auto;font-style:normal;text-transform:none;letter-spacing:0;}
.asf2[class] .asf2-roleslot-cap .ix-revert{margin-left:auto;}
.asf2[class] .asf2-roleslot-cap .asf2-rs-fn{text-transform:none;letter-spacing:0;color:var(--ix-text-mid);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;}
.asf2[class] .asf2-roleslot-cap .asf2-rs-act{margin-left:auto;display:flex;gap:6px;flex:none;}
.asf2[class] .asf2-roleslot.is-empty{border-color:var(--ix-salmon);}
.asf2[class] .asf2-roleslot.is-empty .asf2-roleslot-pic{color:var(--ix-salmon-ink);}
.asf2[class] .asf2-lead{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:6px;}
/* Images column collapse */
.asf2[class] .asf2-grid.is-tray-shut{grid-template-columns:390px minmax(0,1fr) 44px;}
.asf2[class] .asf2-tray-toggle{font:inherit;font-size:10px;border:0;background:none !important;color:var(--asf2-ink);cursor:pointer;text-decoration:underline;text-underline-offset:2px;margin-left:auto;text-transform:none;letter-spacing:0;}
.asf2[class] .asf2-tray-rail{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;padding:6px 0;border:0;background:none !important;cursor:pointer;color:var(--ix-ok);font:inherit;}
.asf2[class] .asf2-tray-rail .n{display:inline-flex;align-items:center;justify-content:center;min-width:17px;height:17px;border-radius:999px;background:var(--ix-ok) !important;color:var(--ix-text-invert);font-family:var(--ix-font-mono);font-size:9.5px;}
.asf2[class] .asf2-tray-rail .v{writing-mode:vertical-rl;font-family:var(--ix-font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;}
.asf2[class] .asf2-tray-rail .ok{writing-mode:vertical-rl;font-size:10px;color:var(--ix-text-mid);}
.asf2[class] .asf2-tray-rail:hover .v{text-decoration:underline;}
.asf2[class] .asf2-grid.is-tray-shut .asf2-col--tray{padding:10px 4px;}
@media (max-width:1180px){.asf2[class] .asf2-grid.is-tray-shut{grid-template-columns:360px minmax(0,1fr);}.asf2[class] .asf2-tray-rail{flex-direction:row;justify-content:center;}.asf2[class] .asf2-tray-rail .v,.asf2[class] .asf2-tray-rail .ok{writing-mode:horizontal-tb;}}

.asf2[class] .asf2-tlist{display:flex;flex-direction:column;gap:6px;}
/* v0.8 — tray card, stacked: name · photo · roles row · caption · alt · print match */
.asf2[class] .asf2-tcard{display:flex;flex-direction:column;gap:5px;padding:6px;border:1px solid var(--ix-border);border-radius:var(--ix-radius-sharp);background:var(--ix-white) !important;}
.asf2[class] .asf2-tcard.is-unused{border-style:dashed;border-color:var(--ix-salmon);background:var(--ix-salmon-ghost) !important;}
.asf2[class] .asf2-tfn{font-family:var(--ix-font-mono);font-size:10px;color:var(--ix-text-mid);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;}
.asf2[class] .asf2-tthumb{width:100%;height:124px;border-radius:3px;position:relative;}
.asf2[class] .asf2-trow{display:flex;gap:4px;align-items:center;flex-wrap:wrap;}
.asf2[class] .asf2-tbtn{font:inherit;font-size:10px;font-weight:600;border:1px solid var(--ix-border-input);background:var(--ix-white) !important;color:var(--ix-text-mid);border-radius:999px;padding:2px 10px;cursor:pointer;line-height:1.3;}
.asf2[class] .asf2-tbtn:hover{border-color:var(--ix-teal);color:var(--ix-teal);}
.asf2[class] .asf2-tbtn[aria-pressed="true"]{background:var(--ix-teal) !important;border-color:var(--ix-teal);color:var(--ix-text-invert);}
.asf2[class] .asf2-tbtn.is-follow{border-style:dashed;border-color:var(--ix-teal);color:var(--ix-teal);background:var(--ix-teal-soft) !important;}
.asf2[class] .asf2-tbtn:focus-visible{outline:2px solid var(--ix-blue);outline-offset:1px;}
.asf2[class] .asf2-tstat{margin-left:auto;display:flex;gap:3px;}
.asf2[class] .asf2-tag{font-size:9.5px;font-weight:600;padding:2px 7px;border-radius:var(--ix-radius-sharp);white-space:nowrap;line-height:1.3;}
.asf2[class] .asf2-tag--inline{background:var(--ix-teal-soft) !important;color:var(--ix-teal);border:1px solid var(--ix-teal-soft);}
.asf2[class] .asf2-tag--unused{background:var(--ix-salmon-soft) !important;color:var(--ix-salmon-ink);border:1px solid var(--ix-salmon);}
.asf2[class] .asf2-tmatch{font-family:var(--ix-font-mono);font-size:9px;color:var(--ix-text-light);text-align:left;}
.asf2[class] .asf2-tmatch.low{color:var(--ix-salmon-ink);}
.asf2[class] .asf2-tcard .ix-picker-input{font-size:11px !important;min-height:24px !important;padding:3px 6px !important;}
.asf2[class] .asf2-tcard .ix-picker-input.ix-picker-input--changed{padding:2px 5px !important;}
.asf2[class] .asf2-tcap-src{font-family:var(--ix-font-mono);font-size:8.5px;color:var(--ix-text-light);}
.asf2[class] .asf2-tray-foot{display:flex;gap:6px;flex-wrap:wrap;align-items:center;}
.asf2[class] .asf2-note{font-size:10.5px;color:var(--ix-text-light);line-height:1.4;}

.asf2[class] .asf2-toast{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ix-teal) !important;color:var(--ix-text-invert);font-size:12px;padding:8px 14px;border-radius:var(--ix-radius-sm);box-shadow:var(--ix-shadow-lg);z-index:50;max-width:92vw;}
.asf2[class] .asf2-toast[hidden]{display:none;}

/* AI assist strip (replaces the tall asf-ai-bar) */
.asf2[class] .asf2-ai{display:flex;align-items:center;gap:8px;padding:4px 8px;border:1px solid var(--ix-border-soft);border-radius:var(--ix-radius-sharp);background:var(--ix-cream-warm) !important;min-height:30px;}
.asf2[class] .asf2-ai.is-busy{border-color:var(--ix-gold);background:var(--ix-gold-glow) !important;}
.asf2[class] .asf2-ai-spark{font-size:12px;}
.asf2[class] .asf2-ai-txt{flex:1;min-width:0;font-size:11px;color:var(--ix-text-mid);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.asf2[class] .asf2-ai-txt b{color:var(--ix-text-dark);font-weight:600;}
.asf2[class] .asf2-ai-btn{font:inherit;font-size:10.5px;font-weight:600;border:1px solid var(--ix-border-input);background:var(--ix-white) !important;color:var(--ix-text-mid);border-radius:var(--ix-radius-sharp);padding:2px 8px;cursor:pointer;white-space:nowrap;}
.asf2[class] .asf2-ai-btn:hover{border-color:var(--ix-gold);color:var(--ix-gold-ink);}
.asf2[class] .asf2-ai-btn--go{border-color:var(--ix-gold);background:var(--ix-gold) !important;color:var(--ix-teal-deep);}
.asf2[class] .asf2-ai-btn--go:hover{background:var(--ix-gold-bright) !important;color:var(--ix-teal-deep);}
.asf2[class] .asf2-ai-btn:disabled{opacity:.45;cursor:not-allowed;}
.asf2[class] .asf2-ai-think .s1{fill:var(--ix-gold);animation:asf2pulse 1.1s ease-in-out infinite;}
.asf2[class] .asf2-ai-think circle{fill:var(--ix-blue);animation:asf2pulse 1.1s ease-in-out infinite;}
.asf2[class] .asf2-ai-think .d2{animation-delay:.15s;} .asf2[class] .asf2-ai-think .d3{animation-delay:.3s;}
@keyframes asf2pulse{0%,100%{opacity:.25}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.asf2[class] .asf2-ai-think *{animation:none;}}
.asf2[class] .asf2-rte-h{font-family:var(--ix-font-display);font-size:14.5px;font-weight:600;color:var(--ix-teal);margin:10px 0 5px;padding:0 4px;display:flex;align-items:center;gap:5px;}
.asf2[class] .asf2-tfn .ix-ai-badge{vertical-align:middle;}



/* ════════════════════════════════════════════════════════════
   v1.0.1 ADDITIONS — same armor: .asf2[class] root, !important on
   every background.
   ════════════════════════════════════════════════════════════ */

/* Photos. The box keeps the mockup's size; the photo fills it. */
.asf2[class] .asf2-imgfill{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit;}
.asf2[class] .asf2-tthumb,.asf2[class] .asf2-pop-item div,.asf2[class] .asf2-fig-thumb{overflow:hidden;background:var(--ix-cream-warm) !important;}
.asf2[class] .asf2-roleslot-pic{overflow:hidden;}

/* Readiness ticks that are buttons (Sponsor OK, Edit pass). */
.asf2[class] button.asf2-tick{border:0;cursor:pointer;font:inherit;font-family:var(--ix-font-mono);font-size:9.5px;line-height:inherit;}
.asf2[class] button.asf2-tick.is-changed{border:1px solid var(--ix-gold-bright);}
.asf2[class] button.asf2-tick:focus-visible{outline:2px solid var(--ix-gold-bright);outline-offset:1px;}

/* "cancel body" sits at the right of the group head. */
.asf2[class] .asf2-group-head .ix-revert{margin-left:auto;}
/* A hidden cancel link stays hidden everywhere in the form, not only in
   field labels (ix-revert's display rule otherwise beats [hidden]). */
.asf2[class] .ix-revert[hidden]{display:none !important;}

/* Body editor (Trix). The toolbar is .asf2-rtebar; the editor is
   .asf2-rte. Blocks are Trix divs, typed like the mockup's paragraphs. */
.asf2[class] trix-editor.asf2-rte{border:0 !important;border-radius:0;margin:0;min-height:320px;outline:none;display:block;}
.asf2[class] .asf2-rtebtn.trix-active{border-color:var(--ix-blue);color:var(--ix-blue-deep);background:var(--ix-blue-ghost) !important;}
.asf2[class] .asf2-rtebar .trix-dialogs{position:absolute;top:100%;left:0;right:0;z-index:21;}
.asf2[class] .asf2-rtebar .trix-dialog{background:var(--ix-white) !important;border:1px solid var(--ix-border);border-radius:var(--ix-radius-sm);box-shadow:var(--ix-shadow-lg);padding:6px 8px;}
.asf2[class] .asf2-rtebar .trix-input{background:var(--ix-white) !important;}
.asf2[class] .asf2-rtebar .trix-button--dialog{background:var(--ix-cream-warm) !important;}

/* Loading line (edit mode, while the record is read). */
.asf2[class] .asf2-loading{padding:18px 14px;}

/* ta-asf shows this when ta-asf-article is not on the page. It sits
   outside .asf2, inside the ASF overlay. */
.ta-asf .asf-missing-module{margin:24px 32px;padding:14px 16px;background:var(--ix-white,#fff);border-left:3px solid var(--ix-salmon,#E8836B);font-size:13px;line-height:1.5;}

/* Character counters, as v1.10.0 had them. Sit before the cancel link. */
.asf2[class] .asf2-count{margin-left:auto;font-family:var(--ix-font-mono);font-size:9px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--ix-text-light);white-space:nowrap;}
.asf2[class] .asf2-count.near,.asf2[class] .asf2-count.under{color:var(--ix-gold-ink);}
.asf2[class] .asf2-count.inrange{color:var(--ix-ok);}
.asf2[class] .asf2-count.over{color:var(--ix-salmon-ink);font-weight:500;}
.asf2[class] .ix-field-label .asf2-count ~ .ix-revert{margin-left:6px;}

/* "raw text" / "source metadata" links in the body group head. */
.asf2[class] .asf2-srclinks{display:flex;gap:8px;margin-left:auto;}
.asf2[class] .asf2-group-head .ix-revert + .asf2-srclinks{margin-left:10px;}
.asf2[class] .asf2-srclinks .ix-revert{margin-left:0;}

/* Inline photo size and alignment chips in the body image popover. */
.asf2[class] .asf2-pop .ix-chip-group{display:flex;gap:4px;flex-wrap:wrap;}
.asf2[class] .asf2-pop .ix-chip{min-height:22px !important;padding:2px 8px !important;font-size:10.5px !important;text-transform:capitalize;}
.asf2[class] .asf2-pop .ix-chip[aria-pressed="true"]{background:var(--ix-teal) !important;border-color:var(--ix-teal) !important;color:var(--ix-text-invert) !important;}

/* v1.0.2 — Main and OG previews at full height: the whole photo, at the
   slot's width, never cropped. The empty slot keeps its 96px prompt. */
.asf2[class] .asf2-roleslot-pic{height:auto;min-height:96px;}
.asf2[class] .asf2-roleslot-pic .asf2-imgfill{height:auto;object-fit:contain;}
.asf2[class] .asf2-lead{align-items:start;}

/* v1.0.4 — Trix's full default toolbar inside .asf2-rtebar. */
.asf2[class] .asf2-rtebar .trix-button-row{flex:1 1 auto;display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-start;align-items:center;overflow:visible;}
.asf2[class] .asf2-rtebar .trix-button-group{margin:0 !important;background:var(--ix-white) !important;border-color:var(--ix-border-input) !important;}
.asf2[class] .asf2-rtebar .trix-button-group-spacer{display:none;}
.asf2[class] .asf2-rtebar .trix-button{background:var(--ix-white) !important;}
.asf2[class] .asf2-rtebar .trix-button.trix-active{background:var(--ix-blue-ghost) !important;}
.asf2[class] .asf2-rtebar .asf2-trix-head{font-weight:700;font-size:11px;color:var(--ix-text-mid);min-width:30px;padding:0 6px;}
.asf2[class] .asf2-rtebar .asf2-trix-head.trix-active{color:var(--ix-blue-deep);}
.asf2[class] .asf2-rtebar .trix-button-group--text-tools .asf2-rtebtn--img{margin:0 0 0 6px;border-radius:0 3px 3px 0;align-self:stretch;}
.asf2[class] .asf2-rtebar .asf2-rtehint{align-self:center;}

/* v1.0.5 — the body section as v1.10.0 had it. Type values copied from
   ta-asf-v1.6.4.css (.ta-asf trix-editor.asf-trix-editor, v1.3.2). */
.asf2[class] .asf2-bodyrow{margin-top:4px;}
.asf2[class] .asf2-bodyrow .asf2-srclinks{margin-left:auto;display:flex;gap:10px;}
.asf2[class] .asf2-bodyrow .asf2-srclinks .ix-revert{color:var(--ix-gold-ink) !important;}
.asf2[class] .asf2-body{overflow:visible;}
.asf2[class] .asf2-body trix-toolbar.asf2-rtebar{position:sticky;top:0;z-index:40;}
.asf2[class] trix-editor.asf2-rte:empty::before{content:attr(placeholder);color:var(--ix-text-light);font-style:italic;}
.asf2[class] trix-editor.asf2-rte h1,
.asf2[class] trix-editor.asf2-rte h2,
.asf2[class] trix-editor.asf2-rte h3{font-family:'Fraunces',Georgia,serif;font-weight:600;color:var(--ix-teal);line-height:1.25;}
.asf2[class] trix-editor.asf2-rte h1{font-size:28px;margin:32px 0 14px;}
.asf2[class] trix-editor.asf2-rte h2{font-size:24px;margin:32px 0 12px;}
.asf2[class] trix-editor.asf2-rte h3{font-size:22px;line-height:1.3;margin:24px 0 10px;}
.asf2[class] trix-editor.asf2-rte p{margin:0 0 .85em;}
.asf2[class] trix-editor.asf2-rte ul,.asf2[class] trix-editor.asf2-rte ol{margin:0 0 .85em;padding-left:1.5em;}
.asf2[class] trix-editor.asf2-rte blockquote{border-left:3px solid var(--ix-gold);margin:.5em 0;padding:2px 14px;color:var(--ix-text-mid);font-style:italic;}
.asf2[class] trix-editor.asf2-rte a{color:var(--ix-blue);text-decoration:underline;}
.asf2[class] trix-editor.asf2-rte pre,.asf2[class] trix-editor.asf2-rte code{font-family:var(--ix-font-mono);font-size:12px;background:var(--ix-cream-warm) !important;padding:1px 5px;border-radius:3px;}
.asf2[class] trix-editor.asf2-rte pre{padding:10px 14px;margin:.5em 0;overflow-x:auto;}
.asf2[class] trix-editor.asf2-rte figure{margin:1em 0;text-align:center;}
.asf2[class] trix-editor.asf2-rte img{max-width:100%;height:auto;border-radius:4px;}
.asf2[class] trix-editor.asf2-rte figcaption{font-size:12px;color:var(--ix-text-light);margin-top:6px;font-style:italic;}
.asf2[class] .asf2-body-foot{display:flex;justify-content:flex-end;padding:6px 12px;border-top:1px solid var(--ix-border-soft);background:var(--ix-cream-warm) !important;}
.asf2[class] .asf2-trixcount{font-family:var(--ix-font-mono);font-size:10px;color:var(--ix-text-light);}
.asf2[class] .asf2-trixcount.near{color:var(--ix-gold-ink);}
.asf2[class] .asf2-trixcount.over{color:var(--ix-salmon-ink);font-weight:500;}
.asf2[class] .asf2-body.is-over{border:2px solid var(--ix-salmon);}
.asf2[class] .asf2-rtebar .trix-button-group--text-tools .asf2-rtebtn--up{margin:0;border-radius:0 3px 3px 0;align-self:stretch;border-left:0;}
.asf2[class] .asf2-rtebar .trix-button-group--text-tools .asf2-rtebtn--img{border-radius:0;}
.asf2[class] .asf2-roleslot-pic[data-asf-action]{cursor:zoom-in;}

/* v1.0.5 — the v1.10.0 panels drawn inside the form (raw text, source
   metadata, the Photo Essay gallery and its picker, the Transcriber
   screenshot strip) keep their backgrounds. ix-surface-scope strips
   every background inside .asf2, so each rule from ta-asf-v1.6.4.css
   that paints one of these panels is re-declared here, root-scoped and
   !important. Values are copied, not changed. */
.asf2[class] .asf-field-label .req-dot{background:var(--gold) !important;}
.asf2[class] .asf-source-strip{background:var(--gold-soft) !important;}
.asf2[class] .asf-picker-bundle-head{background:#fff !important;}
.asf2[class] .asf-picker-bundle-head:hover{background:var(--gold-soft) !important;}
.asf2[class] .asf-picker-bundle-count{background:var(--cream-bg) !important;}
.asf2[class] .asf-picker-thumb{background:#fff !important;}
.asf2[class] .asf-picker-thumb img{background:var(--cream-bg) !important;}
.asf2[class] .asf-picker-thumb-name{background:rgba(26,58,58,0.85) !important;}
.asf2[class] .asf-picker-loose-divider{background:linear-gradient(to right, transparent, var(--input-border), transparent) !important;}
.asf2[class] .asf-raw-panel{background:#22333b !important;}
.asf2[class] .asf-raw-head{background:#1A3A3A !important;}
.asf2[class] .asf-raw-close{background:#C4A35A !important;}
.asf2[class] .asf-raw-close:hover{background:#d4b569 !important;}
.asf2[class] .asf-meta-panel{background:#22333b !important;}
.asf2[class] .asf-meta-head{background:#1A3A3A !important;}
.asf2[class] .asf-meta-close{background:#C4A35A !important;}
.asf2[class] .asf-meta-close:hover{background:#d4b569 !important;}
.asf2[class] .asf-meta-row.is-notes{background:rgba(196,163,90,.10) !important;}
.asf2[class] .asf-meta-note--ok{background:rgba(120,180,140,.12) !important;}
.asf2[class] .asf-meta-note--warn{background:rgba(196,163,90,.12) !important;}
.asf2[class] .asf-gal-tile{background:#fff !important;}
.asf2[class] .asf-gal-img{background:var(--cream-bg) !important;}
.asf2[class] .asf-gal-missing{background:var(--cream-bg) !important;}
.asf2[class] .asf-gal-ord{background:rgba(26,58,58,0.88) !important;}
.asf2[class] .asf-gal-herotag{background:var(--gold) !important;}
.asf2[class] .asf-gal-tools{background:rgba(26,58,58,0.9) !important;}
.asf2[class] .asf-gal-btn{background:transparent !important;}
.asf2[class] .asf-gal-btn:hover{background:rgba(255,255,255,0.18) !important;}
.asf2[class] .asf-gal-btn[disabled]{background:transparent !important;}
.asf2[class] .asf-gal-btn--rm:hover{background:#c0392b !important;}
.asf2[class] .asf-gal-warn{background:var(--cream-bg) !important;}
.asf2[class] .asf-picker-chk{background:rgba(255,255,255,0.92) !important;}
.asf2[class] .asf-picker-thumb.picked .asf-picker-chk{background:var(--gold) !important;}
.asf2[class] .asf-picker-thumb.in-gallery .asf-picker-chk{background:var(--teal) !important;}

/* ── v1.0.6 · print panel (shell is .asf-raw-panel, so it reads as the
   same right-column swap as See raw text) ─────────────────────── */
.asf2[class] .asf-print-panel .asf-raw-body{background:#22333b !important;}
.asf2[class] .asf-print-nav{display:flex !important;align-items:center !important;gap:8px !important;margin:0 0 10px !important;}
.asf2[class] .asf-print-num{flex:0 0 auto !important;min-width:150px !important;text-align:center !important;font:12px/1 'DM Mono',ui-monospace,monospace !important;color:#cdd6d2 !important;white-space:nowrap !important;}
.asf2[class] .asf-print-fullbtn{margin-left:auto !important;color:#e8ece9 !important;}
.asf2[class] .asf-print-img{display:block !important;width:100% !important;height:auto !important;background:#fff !important;cursor:zoom-in !important;box-shadow:0 4px 14px rgba(0,0,0,.35) !important;}
.asf2[class] .asf-print-err{margin:10px 0 !important;padding:10px 12px !important;border-left:3px solid #C4A35A !important;background:rgba(196,163,90,.12) !important;color:#f1e6cc !important;font-size:12.5px !important;line-height:1.5 !important;}
.asf2[class] .asf-print-busy{display:flex !important;align-items:center !important;gap:10px !important;padding:18px 0 !important;color:#cdd6d2 !important;font-size:13px !important;}
.asf2[class] .asf-print-dots{display:inline-flex !important;gap:5px !important;}
.asf2[class] .asf-print-dots i{width:8px !important;height:8px !important;border-radius:50% !important;background:#1F7A5C !important;animation:asf-print-pulse 1.1s ease-in-out infinite !important;}
.asf2[class] .asf-print-dots i:nth-child(2){animation-delay:.18s !important;}
.asf2[class] .asf-print-dots i:nth-child(3){animation-delay:.36s !important;}
@keyframes asf-print-pulse{0%,100%{transform:scale(.6);opacity:.35}50%{transform:scale(1.15);opacity:1}}
@media (prefers-reduced-motion:reduce){.asf2[class] .asf-print-dots i{animation-duration:2.4s !important;}}
.asf2[class] .asf-print-rr-bar{display:flex !important;align-items:center !important;gap:14px !important;margin:14px 0 0 !important;flex-wrap:wrap !important;}
.asf2[class] .asf-print-two{display:inline-flex !important;align-items:center !important;gap:6px !important;font-size:12.5px !important;color:#e8ece9 !important;cursor:pointer !important;}
.asf2[class] .asf-print-rr-bar .ix-revert{color:#e8ece9 !important;}
.asf2[class] .asf-print-rr-h{margin:16px 0 6px !important;font:11px/1 'DM Mono',ui-monospace,monospace !important;letter-spacing:.06em !important;text-transform:uppercase !important;color:#C4A35A !important;}
.asf2[class] .asf-print-rr{background:#fff !important;color:#1A3A3A !important;padding:14px 16px !important;border:2px solid #C4A35A !important;border-radius:6px !important;max-height:46vh !important;overflow:auto !important;font:15px/1.7 'Spectral',Georgia,serif !important;}
.asf2[class] .asf-print-rr h2{font:600 19px/1.3 'Fraunces',Georgia,serif !important;margin:14px 0 6px !important;}
.asf2[class] .asf-print-rr p{margin:0 0 10px !important;}

/* ════════════════════════════════════════════════════════════
   END · ta-asf-article-v1.0.6.css
   ════════════════════════════════════════════════════════════ */

/* ── v1.0.7 · Where it runs (ta-asf-article v1.0.9) ────────────── */
/* Labels and group heads at the mockup's sizes, everywhere on the form. */
.asf2[class] .ix-field-label{font-family:var(--ix-font-body);font-size:11px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--asf2-ink,var(--ix-teal));}
.asf2[class] .asf2-group-head{font-family:var(--ix-font-body);font-size:11px;font-weight:700;letter-spacing:.07em;padding:5px 8px;}
.asf2[class] .asf2-group-head .n{font-family:var(--ix-font-body);font-size:10px;font-weight:700;}
/* Facts column: one row per field, label on the left. */
.asf2[class] .asf2-col--facts .ix-field{display:grid;grid-template-columns:104px minmax(0,1fr);align-items:start;gap:8px;}
.asf2[class] .asf2-col--facts .ix-field-label{flex-direction:column;align-items:flex-start;gap:1px;padding-top:6px;line-height:1.25;}
.asf2[class] .asf2-col--facts .ix-field-label .ix-revert{margin-left:0;}
.asf2[class] .asf2-col--facts .asf2-pair .ix-field{grid-template-columns:max-content minmax(0,1fr);}
.asf2[class] .asf2-col--facts .ix-switch{min-height:28px;}
/* Group 1 leads: solid teal head, a framed box, the Section larger. */
.asf2[class] .asf2-group-head--lead{background:var(--ix-teal) !important;color:var(--ix-text-invert);border-left-color:var(--ix-teal);font-size:12px;padding:7px 10px;}
.asf2[class] .asf2-group-head--lead .n{background:var(--ix-white) !important;color:var(--ix-teal);}
.asf2[class] .asf2-gh-note{margin-left:auto;font-size:10px;font-weight:600;letter-spacing:.02em;text-transform:none;opacity:.85;}
.asf2[class] .asf2-where-box{border:1.5px solid var(--ix-teal);border-radius:var(--ix-radius-sm);background:var(--ix-white) !important;padding:10px;display:flex;flex-direction:column;gap:8px;}
.asf2[class] .asf2-secrow{display:grid;grid-template-columns:minmax(0,1fr) 54px;gap:6px;align-items:center;}
.asf2[class] .asf2-where .ix-picker-input.asf2-sec{min-height:32px !important;font-size:13px !important;font-weight:600 !important;}
.asf2[class] .asf2-where .ix-field:first-child .ix-field-label{font-size:12px;font-weight:700;padding-top:8px;}
.asf2[class] .asf2-ttag{height:26px;border-radius:var(--ix-radius-sharp);display:grid;place-items:center;font-size:12px;font-weight:700;letter-spacing:.04em;background:var(--ix-teal) !important;color:var(--ix-text-invert);white-space:nowrap;}
.asf2[class] .asf2-ttag.is-unset{background:var(--ix-white) !important;color:var(--ix-salmon-deep);box-shadow:inset 0 0 0 1.5px var(--ix-salmon);font-size:10px;letter-spacing:0;}
.asf2[class] .asf2-why{margin-left:112px;font-size:11.5px;color:var(--ix-text-mid);line-height:1.35;}
.asf2[class] .asf2-why.is-bad{color:var(--ix-salmon-deep);font-weight:600;}
.asf2[class] .asf2-legacy{border-top:1px dashed var(--ix-border-soft);padding-top:7px;display:flex;flex-direction:column;gap:3px;}
.asf2[class] .asf2-legacy[hidden]{display:none !important;}
.asf2[class] .asf2-legacy-head{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ix-text-light);}
.asf2[class] .asf2-legacy-row{display:grid;grid-template-columns:104px minmax(0,1fr);gap:8px;font-size:12px;}
.asf2[class] .asf2-legacy-row span:first-child{font-size:11px;font-weight:600;color:var(--ix-text-light);}
.asf2[class] .asf2-legacy-row span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.asf2[class] .asf2-legacy-row span.is-changed{box-shadow:inset 0 -2px 0 var(--ix-gold);}
@media (max-width:760px){.asf2[class] .asf2-why{margin-left:0;}}
