/* Step 6 Export (plan 0457, ported from v11's export-v11.css): spinner, cards, email preview,
   Fix / Check flag boxes, the approval code row, hints and errors. Light page, v11 palette. */
.xspin{display:inline-block;width:13px;height:13px;margin-right:8px;vertical-align:-2px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:xspin .8s linear infinite}
@keyframes xspin{to{transform:rotate(360deg)}}
.ex .btn[disabled]{opacity:.75;cursor:progress}
.xhint{font-size:12.5px;color:var(--ink-3,#6b7280)}
.xerr{font-size:13px;color:var(--bad,#b42318);background:#fbeaea;border:1px solid #e9c4c4;border-radius:6px;padding:8px 10px}
.xsubj{font-size:13px;color:var(--ink-2,#374151)}
.doc.emailx{background:#eef0f3!important;padding:18px 20px!important}
.doc.emailx .xmeta{font-size:13px;color:var(--ink-2,#374151);background:#fff;border:1px solid var(--rule,#d7dce2);border-radius:6px;padding:8px 12px;margin:0 0 12px}
.doc.emailx .xwrap{background:#fff;max-width:602px;margin:0 auto}
.doc.emailx .xwrap img{max-width:100%;height:auto}
.ex-email .th{background:#eef0f3}
.ex{display:flex;flex-direction:column}
.ex .bd{flex:none;display:flex;flex-direction:column;gap:8px}
.xrow{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.xflags{display:flex;flex-direction:column;gap:6px}
.xflags label{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;line-height:1.4;border-radius:6px;padding:6px 8px}
.xflags input{margin-top:2px;flex:none}
.xfix{background:#fbeaea;border:1px solid #e9c4c4;color:var(--bad,#b42318)}
.xchk{background:#fbf3e2;border:1px solid #ecd9ae;color:var(--ink-2,#374151);cursor:pointer}
/* Step 6 layout (walk at 1440x900): #exp stacks a compact approval row over a card grid. */
#exp.exp{display:block!important}
.xap{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:0 0 14px;padding:8px 14px;border:1px solid var(--rule,#d7dce2);border-radius:10px;background:#fff}
.xap .xap-t{font-size:13.5px}
.xap label{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--ink-2,#374151)}
.xap input{font:inherit;font-size:13px;padding:4px 8px;border:1px solid var(--rule,#d7dce2);border-radius:6px}
.xap input[type=text]{width:150px}
.xap #ap-line{flex:1 1 220px;min-width:0}
.exp-grid{display:grid;gap:16px;align-items:start;grid-template-columns:repeat(3,minmax(0,1fr))}
.ex .th{flex:none;height:200px!important;overflow:hidden;background:#f4f5f7}
.ex .th img.xpg{display:block;width:100%;height:auto}
@media (max-width:1279px){.exp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:899px){.exp-grid{grid-template-columns:1fr}.xap #ap-line{flex-basis:100%}}
