/* ix-ai-v1.3.1.css */
/* v1.3.1 (20 Oct 2026): the "Keep the current one" link in each New version row (ix-ai-v1.3.1.js). */
/* v1.3.0 (20 Oct 2026): Current line, New version label, numbering, a colour edge per group, more air (ix-ai-v1.3.0.js). */
/* ============================================================
   ix-ai-v1.1.0.css — styles for the shared AI writing modal (ix-ai-v1.1.0.js)
   v1.1.0 (20 Oct 2026, 106 Gap Interview S4): the modal redesigned
   from Jeff's review of the Greeting tab mockup v0.4:
     - the dialog takes the screen, 24px in from every edge, instead
       of a 1240px box with two columns squeezed inside it;
     - two full-width panes, Spread and Prompt, switched by the header
       tabs at every width (no side-by-side split);
     - each field is a white card on the cream ground, 32px apart, with
       a display-face heading, the "your version" count, the options in
       a row, the edit box, and that field's regenerate line at the foot;
     - the Prompt pane shows the shared prompt at full width and
       readable size, with one block per field beside it, then the
       session history.
   v1.0.1 kept: the overlay sits at z-index 99999 (HC-AI-4; the IPP
   shell is 9000). Uses ix-tokens; buttons are ix-buttons classes.
   ============================================================ */
html.ixai-lock { overflow: hidden; }
.ixai-ov { position: fixed; inset: 0; z-index: 99999; background: rgba(20, 24, 32, .45); display: flex; align-items: stretch; justify-content: center; padding: 24px; opacity: 0; transition: opacity .18s var(--ix-ease, ease); }
.ixai-ov.is-open { opacity: 1; }
.ixai-dlg { width: 100%; height: 100%; display: flex; flex-direction: column; background: var(--ix-surface, #fff); color: var(--ix-text-dark, #1d2430); border: 1px solid var(--ix-border, #e3dfd5); border-radius: 18px; box-shadow: var(--ix-shadow-lg, 0 20px 60px rgba(0,0,0,.2)); overflow: hidden; font-family: var(--ix-font-body, inherit); transform: translateY(8px); transition: transform .18s var(--ix-ease, ease); }
.ixai-ov.is-open .ixai-dlg { transform: none; }

/* header: title and context left, the two pane tabs and Cancel right */
.ixai-head { display: flex; align-items: center; gap: 28px; padding: 22px 36px; border-bottom: 1px solid var(--ix-border, #e3dfd5); background: var(--ix-surface, #fff); }
.ixai-h { margin: 0; font: 600 26px/1.1 var(--ix-font-display, inherit); letter-spacing: -.01em; }
.ixai-ctx { margin: 0; font-size: 13.5px; color: var(--ix-text-mid, #5d6676); }
.ixai-sp { flex: 1; }
.ixai-seg { display: inline-flex; border: 1px solid var(--ix-border, #e3dfd5); border-radius: 999px; padding: 3px; background: var(--ix-cream, #faf7f0); }
.ixai-seg button { font: 600 13px/1 var(--ix-font-body, inherit); padding: 9px 22px; border: 0; border-radius: 999px; background: transparent; color: var(--ix-text-mid, #5d6676); cursor: pointer; }
.ixai-seg button.is-on { background: var(--ix-blue, #5b7fff); color: var(--ix-text-invert, #fff); box-shadow: var(--ix-blue-shadow, 0 2px 8px rgba(91,127,255,.2)); }
.ixai-x { width: 40px; height: 40px; border: 1px solid var(--ix-border, #e3dfd5); border-radius: 50%; background: transparent; font-size: 20px; line-height: 1; cursor: pointer; color: var(--ix-text-mid, #5d6676); }

.ixai-busy, .ixai-err { margin: 0; padding: 10px 36px; font-size: 13.5px; }
.ixai-busy { background: var(--ix-gold-light, #fbf5e6); color: var(--ix-gold-ink, #7a5a12); }
.ixai-err { background: var(--ix-salmon-ghost, #fdf1ec); color: var(--ix-salmon-ink, #a63a1f); }

/* one pane at a time, at every width */
.ixai-body { display: block; flex: 1; min-height: 0; overflow: hidden; }
.ixai-left, .ixai-right { height: 100%; overflow: auto; box-sizing: border-box; }
.ixai-ov[data-ixai-show="cands"] .ixai-right, .ixai-ov[data-ixai-show="prompt"] .ixai-left { display: none; }

/* ── the Spread pane: one card per field on the cream ground ── */
.ixai-left { background: var(--ix-cream, #faf7f0); padding: 32px 36px; display: flex; flex-direction: column; gap: 32px; }
.ixai-f { flex: none; background: var(--ix-surface, #fff); border: 1px solid var(--ix-border, #e3dfd5); border-radius: 16px; padding: 0 0 22px; box-shadow: var(--ix-shadow-md, 0 1px 2px rgba(30,42,58,.04), 0 8px 28px -14px rgba(30,42,58,.22)); }
.ixai-f .ixai-eb { margin: 0; padding: 18px 28px; border-bottom: 1px solid var(--ix-border, #e3dfd5); display: flex; align-items: center; gap: 16px; }
.ixai-f .ixai-eb > span:first-child { font: 600 20px/1.2 var(--ix-font-display, inherit); color: var(--ix-text-dark, #1d2430); letter-spacing: 0; text-transform: none; }
.ixai-f .ixai-cnt::before { content: ""; }   /* v1.3.0: the New version label carries the words */
.ixai-cnt { margin-left: 0; font: 500 12.5px var(--ix-font-body, inherit); letter-spacing: 0; text-transform: none; color: var(--ix-text-light, #8a8f9a); }
.ixai-cnt.is-at { color: var(--ix-salmon-ink, #a63a1f); }
.ixai-cands { display: grid; gap: 16px; grid-template-columns: repeat(var(--ixai-cols, 3), minmax(0, 1fr)); padding: 22px 28px 0; margin: 0; }
@media (max-width: 760px) { .ixai-cands { grid-template-columns: 1fr; } }
.ixai-cand { text-align: left; font: 14.5px/1.5 var(--ix-font-body, inherit); color: var(--ix-text-dark, #1d2430); background: var(--ix-surface, #fff); border: 1px solid var(--ix-border, #e3dfd5); border-radius: 12px; padding: 16px 18px; cursor: pointer; min-height: 96px; }
.ixai-cand:hover { border-color: var(--ix-gold, #c99a2e); background: var(--ix-gold-glow, #fffdf6); }
.ixai-cand.is-on { border-color: var(--ix-gold, #c99a2e); box-shadow: var(--ix-gold-shadow, 0 0 0 3px rgba(201,154,46,.18)); background: var(--ix-gold-glow, #fffdf6); }
.ixai-tone { display: flex; justify-content: space-between; font: 700 11px/1 var(--ix-font-body, inherit); letter-spacing: .06em; text-transform: uppercase; color: var(--ix-text-mid, #5d6676); margin: 0 0 8px; }
.ixai-tone em { font: 500 11px var(--ix-font-body, inherit); font-style: normal; letter-spacing: 0; text-transform: none; color: var(--ix-text-light, #8a8f9a); }
.ixai-cand.is-on .ixai-tone::after { content: "\2713 chosen"; color: var(--ix-gold-ink, #7a5a12); font-weight: 700; }
.ixai-empty { margin: 0; padding: 0 28px; font-size: 13px; color: var(--ix-text-light, #8a8f9a); grid-column: 1 / -1; }

.ixai-edit, .ixai-in, .ixai-prompt, .ixai-fprompt { box-sizing: border-box; font: 14.5px/1.5 var(--ix-font-body, inherit); color: var(--ix-text-dark, #1d2430); background: var(--ix-surface, #fff); border: 1.5px solid var(--ix-border-input, #d9d4c8); border-radius: 12px; padding: 12px 14px; }
.ixai-edit { display: block; width: calc(100% - 56px); margin: 18px 28px 0; resize: none; }
.ixai-edit.is-set { border-color: var(--ix-changed-border, var(--ix-gold, #c99a2e)); box-shadow: var(--ix-changed-shadow, 0 0 0 3px rgba(201,154,46,.14)); }
.ixai-f .ixai-redo { display: flex; gap: 8px; align-items: center; padding: 0 28px; margin-top: 18px; }
.ixai-redo .ixai-in { flex: 1; height: 40px; border-radius: 999px; padding: 0 16px; }
.ixai-redo .ix-btn { height: 40px; }
.ixai-sm { white-space: nowrap; }
.ixai-left > .ixai-note { margin: 0; }
.ixai-note { margin: 10px 0 0; font-size: 12.5px; color: var(--ix-text-mid, #5d6676); }
.ixai-note a { color: inherit; }

/* ── the Prompt pane: shared prompt left, field prompts and history right ── */
.ixai-right { background: var(--ix-surface, #fff); padding: 32px 36px; display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(360px, 1fr); gap: 0 40px; align-items: start; }
@media (max-width: 1100px) { .ixai-right { grid-template-columns: 1fr; gap: 28px 0; } }
.ixai-pcol { display: flex; flex-direction: column; min-height: 100%; }
.ixai-fcol { display: flex; flex-direction: column; gap: 16px; }
.ixai-eb { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--ix-text-light, #8a8f9a); }
.ixai-eb--big { flex-wrap: wrap; margin: 0 0 14px; letter-spacing: 0; text-transform: none; }
.ixai-eb--big > span:first-child { font: 600 20px/1.2 var(--ix-font-display, inherit); color: var(--ix-text-dark, #1d2430); }
.ixai-eb--big small { flex-basis: 100%; font: 400 13px/1.4 var(--ix-font-body, inherit); color: var(--ix-text-mid, #5d6676); }
.ixai-eb--hist { margin-top: 28px; font: 600 14px var(--ix-font-body, inherit); letter-spacing: 0; text-transform: none; color: var(--ix-text-dark, #1d2430); }
.ixai-prompt { width: 100%; flex: 1; min-height: 420px; font: 15px/1.65 var(--ix-font-body, inherit); padding: 22px 24px; border-radius: 14px; resize: vertical; white-space: pre-wrap; }
.ixai-prompt-hl { font: 15px/1.65 var(--ix-font-body, inherit); white-space: pre-wrap; min-height: 420px; max-height: 60vh; overflow: auto; background: var(--ix-surface, #fff); border: 1.5px solid var(--ix-gold, #c99a2e); border-radius: 14px; padding: 22px 24px; cursor: text; }
.ixai-prompt-hl mark { background: var(--ix-gold-light, #ffe9a8); color: inherit; padding: 0 2px; border-radius: 2px; }
.ixai-pcol .ixai-redo { display: flex; gap: 8px; align-items: center; margin-top: 14px; }
.ixai-fp { border: 1px solid var(--ix-border, #e3dfd5); border-radius: 14px; padding: 14px 16px; background: var(--ix-cream, #faf7f0); }
.ixai-fp b { display: block; font: 600 13px var(--ix-font-body, inherit); margin: 0 0 6px; }
.ixai-fprompt { display: block; width: 100%; min-height: 74px; font-size: 13px; border-width: 1px; border-radius: 10px; padding: 10px 12px; resize: vertical; }
.ixai-hist { font-size: 12.5px; color: var(--ix-text-mid, #5d6676); }
.ixai-row { display: flex; gap: 10px; padding: 7px 0; border-top: 1px solid var(--ix-border, #e3dfd5); }
.ixai-row span { color: var(--ix-text-mid, #5d6676); min-width: 60px; font-family: var(--ix-font-mono, ui-monospace, Menlo, monospace); font-size: 12px; }
.ixai-row--none { color: var(--ix-text-light, #8a8f9a); }

/* ── footer ── */
.ixai-foot { display: flex; align-items: center; gap: 18px; padding: 18px 36px; border-top: 1px solid var(--ix-border, #e3dfd5); background: var(--ix-surface, #fff); }
.ixai-foot .ix-btn { height: 44px; }
.ixai-foot .ix-btn--primary { padding: 0 26px; font-size: 14px; }
.ixai-msg { font-size: 13px; color: var(--ix-text-mid, #5d6676); }
.ixai-ov.is-busy .ixai-cand { pointer-events: none; opacity: .6; }
@media (prefers-reduced-motion: reduce) { .ixai-ov, .ixai-dlg { transition: none; } }

/* ── v1.2.0 · strict lengths and groups ───────────────────── */
.ixai-grp{margin:0 0 -16px;font:600 20px/1.2 var(--ix-font-display,'Fraunces',Georgia,serif);letter-spacing:-.01em;color:var(--ix-text-dark,#1E2A3A)}
.ixai-grp:not(:first-child){margin-top:12px;padding-top:28px;border-top:1px solid var(--ix-border,#E4E0D4)}
.ixai-cnt.is-bad{color:var(--ix-salmon-ink,#C0432B);font-weight:700}
.ixai-cand.is-short,.ixai-cand.is-long{border-style:dashed;border-color:rgba(192,67,43,.45)}
.ixai-cand .ixai-tone em.is-bad{color:var(--ix-salmon-ink,#C0432B);font-weight:700}

/* ── v1.3.0 · current, new version, numbering, group colour ── */
.ixai-left { gap: 40px; }
.ixai-f { border-left: 5px solid var(--ixai-gc, var(--ix-border, #e3dfd5)); }
.ixai-f[data-ixai-gi="0"], .ixai-grp[data-ixai-gi="0"] { --ixai-gc: var(--ix-blue, #5B7FFF); }
.ixai-f[data-ixai-gi="1"], .ixai-grp[data-ixai-gi="1"] { --ixai-gc: var(--ix-teal, #1A3A3A); }
.ixai-f[data-ixai-gi="2"], .ixai-grp[data-ixai-gi="2"] { --ixai-gc: var(--ix-gold, #C4A35A); }
.ixai-grp { padding-left: 14px; border-left: 5px solid var(--ixai-gc, transparent); }
.ixai-no { font: 700 11px/1 var(--ix-font-body, inherit); letter-spacing: .1em; text-transform: uppercase; color: var(--ixai-gc, var(--ix-text-light, #8a8f9a)); margin-right: 4px; }
.ixai-lim { margin-left: auto; font: 500 12.5px var(--ix-font-body, inherit); color: var(--ix-text-light, #8a8f9a); }
.ixai-cur { margin: 0; padding: 16px 28px; background: var(--ix-cream, #faf7f0); border-bottom: 1px solid var(--ix-border, #e3dfd5); display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 12px; align-items: baseline; }
.ixai-cur-k { font: 700 10.5px/1.2 var(--ix-font-body, inherit); letter-spacing: .12em; text-transform: uppercase; color: var(--ix-text-mid, #5d6676); }
.ixai-cur-v { margin: 0; font: 400 14.5px/1.55 var(--ix-font-body, inherit); color: var(--ix-text-dark, #1d2430); white-space: pre-wrap; overflow-wrap: anywhere; }
.ixai-cur-v.is-none { font-style: italic; color: var(--ix-text-light, #8a8f9a); }
.ixai-nv { display: flex; align-items: baseline; gap: 12px; padding: 22px 28px 0; }
.ixai-nv-k { font: 700 10.5px/1.2 var(--ix-font-body, inherit); letter-spacing: .12em; text-transform: uppercase; color: var(--ix-gold-ink, #7a5a12); }
.ixai-nv .ixai-cnt { margin-left: auto; }
.ixai-nv .ixai-keep { font-size: 12px; white-space: nowrap; }   /* v1.3.1: the Keep the current one link */
.ixai-nv .ixai-keep[hidden] { display: none; }
.ixai-edit { margin-top: 8px; }
.ixai-cands:empty + .ixai-nv { padding-top: 22px; }