/* imp-desk.css — P17: the signed-in "desk": the top bar (where you are, the balance, the
   account menu), the dashboard (action tiles, figure cards with rings, the funds history pane,
   questions, price cards) and the one-page bulk upload (the generator card, how-it-works strip,
   drop zone, job card, preview, live progress and the veils: mismatch, column matching,
   confirm). Loaded after imp-theme.css. Colours come from brand.css tokens only; text is
   sentence case (no text-transform). */

/* ---------- top bar ---------- */
main.main { padding-top: 18px; }
.imp-topbar {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  max-width: calc(var(--page-max) + var(--imp-rail-w) + 2 * var(--page-pad));
  margin-left: var(--imp-rail-w); padding: 18px 32px 0; min-width: 0;
}
.imp-crumbs { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: var(--fs-1); color: var(--imp-muted); white-space: nowrap; }
.imp-crumbs a { color: var(--imp-primary-strong); font-weight: 700; text-decoration: none; }
.imp-crumbs a:hover { text-decoration: underline; }
.imp-crumbs__sep { opacity: .45; }
.imp-crumbs__here { overflow: hidden; text-overflow: ellipsis; }
.imp-topbar__tools { display: flex; align-items: center; gap: 10px; flex: none; }
.imp-purse {
  display: inline-flex; align-items: center; gap: 7px; min-height: 40px; padding: 0 14px;
  border: 1px solid var(--imp-rule-strong); border-radius: 999px; background: var(--imp-surface); box-shadow: var(--imp-shadow);
  color: var(--imp-secondary); font-size: 13px; font-weight: 600; text-decoration: none; white-space: nowrap;
  transition: transform var(--imp-ease), box-shadow var(--imp-ease);
}
.imp-purse:hover { transform: translateY(-1px); box-shadow: var(--imp-shadow-md); }
.imp-purse .bi { color: var(--imp-primary-strong); }
.imp-purse__amount { color: var(--imp-ink); font-weight: 800; font-variant-numeric: tabular-nums; }
.imp-account { position: relative; }
.imp-account > summary { list-style: none; }
.imp-account > summary::-webkit-details-marker { display: none; }
.imp-account__btn {
  display: flex; align-items: center; gap: 9px; min-height: 40px; padding: 5px 12px 5px 5px; cursor: pointer; user-select: none;
  border: 1px solid var(--imp-rule-strong); border-radius: 999px; background: var(--imp-surface); box-shadow: var(--imp-shadow);
  transition: transform var(--imp-ease), box-shadow var(--imp-ease);
}
.imp-account__btn:hover { transform: translateY(-1px); box-shadow: var(--imp-shadow-md); }
.imp-account__avatar {
  display: grid; place-items: center; width: 30px; height: 30px; flex: none; border-radius: 50%;
  background: linear-gradient(135deg, var(--imp-primary-2), var(--imp-primary)); color: var(--imp-primary-ink); font-weight: 800; font-size: 13px;
}
.imp-account__text { display: flex; flex-direction: column; min-width: 0; line-height: 1.15; }
.imp-account__email { max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 700; color: var(--imp-ink); }
.imp-account__role { font-size: 11px; color: var(--imp-muted); }
.imp-account__btn > .bi { font-size: 11px; color: var(--imp-muted); }
.imp-account__menu {
  position: absolute; right: 0; top: calc(100% + 8px); z-index: 60; min-width: 240px; padding: 8px;
  background: var(--imp-surface); border: 1px solid var(--imp-rule-strong); border-radius: 16px; box-shadow: var(--imp-shadow-md);
}
.imp-account__head {
  display: flex; flex-direction: column; gap: 2px; margin: 0 0 6px; padding: 10px; border-radius: 12px;
  background: var(--imp-primary-wash); border: 1px solid var(--imp-primary-wash-2);
}
.imp-account__head .imp-account__email { max-width: 260px; }
.imp-account__menu form { margin: 0; }
.imp-account__item, .imp-account .imp-signout {
  display: flex; align-items: center; gap: 9px; width: 100%; min-height: 0; margin: 0; padding: 9px 10px;
  border: 0; border-radius: 12px; background: none; box-shadow: none;
  color: var(--imp-ink); font: inherit; font-size: 13px; font-weight: 600; text-align: left; text-decoration: none; cursor: pointer;
}
.imp-account__item:hover, .imp-account .imp-signout:hover { background: var(--imp-primary-wash); color: var(--imp-ink); }
.imp-account__item .bi { color: var(--imp-primary-strong); font-size: 16px; }
@media (max-width: 900px) { .imp-topbar { margin-left: 0; padding: 10px 14px 0; } }
@media (max-width: 640px) {
  .imp-account__text, .imp-purse__label, .imp-purse .bi { display: none; }
  .imp-purse { padding: 0 12px; }
  .imp-account__btn { padding: 4px 8px 4px 4px; gap: 6px; }
  .imp-account__menu { right: -4px; min-width: 210px; max-width: calc(100vw - 28px); }
}

/* ---------- shared desk pieces ---------- */
.page-header--ruled { padding-bottom: 16px; margin-bottom: 16px; border-bottom: 1px solid var(--imp-rule); }
.page-header--ruled .page-title { font-size: 22px; font-weight: 800; letter-spacing: -0.025em; }
.page-header--ruled .page-sub { font-size: 13px; }
.desk-card { background: var(--imp-surface); border: 1px solid var(--imp-rule); border-radius: 16px; box-shadow: var(--imp-shadow); }
.desk-card__body { padding: 16px; }
.desk-card + .desk-card, .desk-block { margin-top: 18px; }
.desk-heading { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 15px; font-weight: 800; color: var(--imp-ink); }
.desk-heading .bi { color: var(--imp-primary-strong); }
.desk-heading + .page-sub { margin: 2px 0 12px; }
.btn-quiet {
  display: inline-flex; align-items: center; gap: 8px; min-height: 38px; padding: 0 16px; cursor: pointer;
  border: 1px solid var(--imp-rule-strong); border-radius: 14px; background: var(--imp-surface); box-shadow: var(--imp-shadow);
  color: var(--imp-ink); font: inherit; font-weight: 800; font-size: 14px; text-decoration: none; white-space: nowrap;
  transition: background var(--imp-ease), transform var(--imp-ease), color var(--imp-ease);
}
.btn-quiet .bi { color: var(--imp-primary-strong); }
.btn-quiet:hover { background: var(--imp-primary-wash); transform: translateY(-1px); color: var(--imp-ink); text-decoration: none; }
.btn-quiet[aria-expanded="true"] { background: var(--imp-primary-wash); border-color: var(--imp-primary-glow); color: var(--imp-primary-strong); }
.btn-quiet--sm { min-height: 30px; padding: 0 12px; border-radius: 10px; font-size: 12px; }
.btn-imp-primary.btn--sm { min-height: 30px; padding: 0 14px; font-size: 12px; border-radius: 10px; }
.btn-quiet--danger .bi, .btn-quiet--danger { color: var(--imp-red); }

/* ---------- dashboard ---------- */
.tile-row { display: grid; gap: 16px; grid: auto-flow / repeat(3, minmax(0, 1fr)); margin: 4px 0 8px; }
.tile-link {
  display: flex; align-items: center; gap: 14px; min-width: 0; padding: 18px 20px;
  border: 1px solid var(--imp-rule); border-radius: 16px; background: var(--imp-surface); box-shadow: var(--imp-shadow);
  color: var(--imp-ink); text-decoration: none; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.tile-link:hover { transform: translateY(-2px); box-shadow: var(--imp-shadow-md); border-color: var(--imp-primary-glow); text-decoration: none; }
.tile-link__icon { display: grid; place-items: center; width: 44px; height: 44px; flex: none; border-radius: 12px; font-size: 20px; }
.tile-link__label { display: block; font-weight: 800; font-size: 14px; }
.tile-link__desc { display: block; font-size: 12px; color: var(--imp-muted); font-weight: 500; }
.tone-gold { background: var(--imp-primary-wash-2); color: var(--imp-primary-strong); }
.tone-ink { background: var(--imp-bg); color: var(--imp-ink); }
.tone-ochre { background: var(--imp-amber-wash); color: var(--imp-amber); }
.tone-green { background: var(--imp-green-wash); color: var(--imp-green); }

.desk-alert {
  display: flex; align-items: center; gap: 10px; margin: 8px 0 16px; padding: 10px 16px; border-radius: 12px;
  background: var(--imp-amber-wash); border: 1px solid var(--imp-primary-glow); color: var(--imp-secondary); font-size: 13px; font-weight: 700;
}
.desk-alert .bi { color: var(--imp-amber); }
.desk-alert--welcome { background: var(--imp-green-wash); border-color: var(--imp-green-wash); }
.desk-alert--welcome .bi { color: var(--imp-green); }

.quick-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-top: 8px; }
.role-tag { display: inline-flex; align-items: center; gap: 4px; margin-left: 6px; padding: 1px 9px; border-radius: 6px; background: var(--imp-primary-wash-2); color: var(--imp-primary-strong); font-size: 11px; font-weight: 700; }

.kpi-grid { display: grid; gap: 16px; grid: auto-flow / repeat(4, minmax(0, 1fr)); margin-top: 12px; }
.kpi {
  position: relative; overflow: hidden; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; min-width: 0;
  padding: 16px; background: var(--imp-surface); border: 1px solid var(--imp-rule); border-radius: 16px; box-shadow: var(--imp-shadow);
}
.kpi::before { content: ''; position: absolute; inset: 0 0 auto 0; height: 2px; background: linear-gradient(90deg, var(--kpi-a), var(--kpi-b)); }
.kpi--gold { --kpi-a: var(--imp-primary-2); --kpi-b: var(--imp-primary); --kpi-wash: var(--imp-primary-wash-2); --kpi-ink: var(--imp-primary-strong); }
.kpi--bronze { --kpi-a: var(--imp-primary); --kpi-b: var(--imp-primary-strong); --kpi-wash: var(--imp-primary-wash); --kpi-ink: var(--imp-primary-strong); }
.kpi--ink { --kpi-a: var(--imp-secondary); --kpi-b: var(--imp-ink); --kpi-wash: var(--imp-bg); --kpi-ink: var(--imp-ink); }
.kpi--ochre { --kpi-a: var(--imp-primary-2); --kpi-b: var(--imp-amber); --kpi-wash: var(--imp-amber-wash); --kpi-ink: var(--imp-amber); }
.kpi__main { min-width: 0; }
.kpi__icon { display: grid; place-items: center; width: 34px; height: 34px; margin-bottom: 10px; border-radius: 10px; background: var(--kpi-wash); color: var(--kpi-ink); font-size: 16px; }
.kpi__key { margin: 4px 0 0; font-size: 11px; font-weight: 700; letter-spacing: .04em; color: var(--imp-muted); }
.kpi__value { margin: 3px 0 0; font-size: 20px; font-weight: 800; letter-spacing: -0.03em; color: var(--imp-ink); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.kpi__ring {
  --p: 60; position: relative; flex: none; width: 40px; height: 40px; border-radius: 50%; opacity: .9;
  background: conic-gradient(from 90deg, var(--kpi-b) calc(var(--p) * 1%), var(--imp-rule) 0);
}
.kpi__ring::after { content: ''; position: absolute; inset: 8px; border-radius: 50%; background: var(--imp-surface); border: 1px solid var(--imp-rule); }
.kpi__ring--40 { --p: 40; } .kpi__ring--52 { --p: 52; } .kpi__ring--55 { --p: 55; }
.kpi__ring--62 { --p: 62; } .kpi__ring--68 { --p: 68; } .kpi__ring--72 { --p: 72; }

.pane { margin-top: 16px; padding: 16px; background: var(--imp-surface); border: 1px solid var(--imp-rule); border-radius: 16px; box-shadow: var(--imp-shadow); }
.pane[hidden] { display: none; }
.pane__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.pane__close {
  display: grid; place-items: center; width: 34px; height: 34px; flex: none; cursor: pointer;
  border: 1px solid var(--imp-rule-strong); border-radius: 9px; background: var(--imp-surface); box-shadow: var(--imp-shadow-xs);
  color: var(--imp-primary-strong); font-size: 14px;
}
.pane__close:hover { background: var(--imp-primary-wash); }
.pane-table-wrap { overflow-x: auto; }
.pane-table { width: 100%; border-collapse: collapse; font-size: 13px; white-space: nowrap; }
.pane-table th { padding: 8px 12px; text-align: left; font-size: 11px; font-weight: 700; letter-spacing: .03em; color: var(--imp-muted); background: var(--imp-bg); border-bottom: 1px solid var(--imp-rule); }
.pane-table th .bi { margin-right: 6px; color: var(--imp-primary-strong); }
.pane-table td { padding: 12px; border-bottom: 1px solid var(--imp-rule); color: var(--imp-secondary); }
.pane-table tr:last-child td { border-bottom: 0; }
.pane-table .num { text-align: right; font-variant-numeric: tabular-nums; }
.amount-tag { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 7px; font-weight: 700; font-variant-numeric: tabular-nums; }
.amount-tag--in { background: var(--imp-green-wash); color: var(--imp-green); }
.amount-tag--out { background: var(--imp-red-wash); color: var(--imp-red); }

.faq-list { display: flex; flex-direction: column; gap: 8px; }
.faq-item { overflow: hidden; border: 1px solid var(--imp-rule); border-radius: 16px; background: var(--imp-surface); box-shadow: var(--imp-shadow-xs); transition: border-color .15s; }
.faq-item:hover { border-color: var(--imp-primary-glow); }
.faq-item > summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px; cursor: pointer; list-style: none; font-weight: 600; font-size: 13px; color: var(--imp-ink); }
.faq-item > summary::-webkit-details-marker { display: none; }
.faq-item > summary .bi { color: var(--imp-primary-strong); }
.faq-item__q { display: flex; align-items: center; gap: 8px; }
.faq-item__plus { color: var(--imp-muted); transition: transform .15s; }
.faq-item[open] .faq-item__plus { transform: rotate(45deg); }
.faq-item__a { margin: 0; padding: 0 14px 12px; font-size: 13px; line-height: 1.6; color: var(--imp-muted); }

.price-grid { display: grid; gap: 14px; grid: auto-flow / repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
.price-card { overflow: hidden; border: 1px solid var(--imp-rule); border-radius: 14px; background: var(--imp-surface); box-shadow: var(--imp-shadow-xs); transition: box-shadow .18s, border-color .18s; }
.price-card:hover { box-shadow: var(--imp-shadow); border-color: var(--imp-primary-glow); }
.price-card__head { padding: 12px 16px; background: var(--imp-primary-wash); border-bottom: 1px solid var(--imp-rule); }
.price-card__name { display: flex; align-items: center; gap: 6px; margin: 0; font-weight: 800; font-size: 14px; color: var(--imp-ink); overflow-wrap: anywhere; }
.price-card__name .bi { color: var(--imp-primary-strong); }
.price-card__meta { margin: 2px 0 0; font-size: 11px; font-weight: 700; color: var(--imp-primary-strong); }
.price-card__desc { margin: 1px 0 0; font-size: 11px; color: var(--imp-muted); }
.price-card table { width: 100%; border-collapse: collapse; font-size: 12px; }
.price-card th { padding: 8px 16px; text-align: left; font-size: 10px; font-weight: 800; letter-spacing: .04em; color: var(--imp-muted); border-bottom: 1px solid var(--imp-rule); }
.price-card td { padding: 8px 16px; border-bottom: 1px solid var(--imp-rule); font-variant-numeric: tabular-nums; color: var(--imp-secondary); }
.price-card tr:last-child td { border-bottom: 0; }
.price-card__price { color: var(--imp-green); font-weight: 700; }
.desk-empty { padding: 20px; text-align: center; color: var(--imp-muted); font-size: 13px; }

@media (max-width: 1200px) { .kpi-grid { grid: auto-flow / repeat(2, minmax(0, 1fr)); } }
@media (max-width: 768px) {
  .tile-row, .kpi-grid { grid: auto-flow / minmax(0, 1fr); }
  .tile-link { padding: 14px; }
  .tile-link__icon { width: 36px; height: 36px; font-size: 16px; }
}

/* ---------- bulk upload ---------- */
.gen-shell { padding: 24px; background: var(--imp-surface); border: 1px solid var(--imp-rule); border-radius: 16px; box-shadow: var(--imp-shadow); }
.gen-shell__head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 8px; }
.gen-shell__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 15px; font-weight: 800; color: var(--imp-ink); }
.gen-shell__title .bi { color: var(--imp-primary-strong); }
.gen-shell > .imp-alert { margin: 14px 0 0; }
.howto { margin-top: 12px; padding: 14px 16px; border-radius: 12px; background: var(--imp-primary-wash); border: 1.5px solid var(--imp-primary-wash-2); }
.howto__title { margin: 0 0 8px; font-size: 12px; font-weight: 800; letter-spacing: .04em; color: var(--imp-primary-strong); }
.howto__steps { display: grid; gap: 8px; grid: auto-flow / repeat(auto-fit, minmax(180px, 1fr)); margin: 0; padding: 0; list-style: none; }
.howto__step { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: var(--imp-text); min-width: 0; }
.howto__num { display: inline-flex; align-items: center; justify-content: center; flex: none; min-width: 20px; height: 20px; border-radius: 50%; background: linear-gradient(135deg, var(--imp-primary-2), var(--imp-primary)); color: var(--imp-primary-ink); font-size: 10px; font-weight: 900; }
.howto__cols { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; margin-top: 10px; font-size: 11px; color: var(--imp-muted); }
.howto__cols .bi { color: var(--imp-primary-strong); }
.howto__cols .chip-row { margin: 0; gap: 4px; }
.howto__cols .chip { padding: 1px 8px; font-size: 11px; }

.dropzone {
  position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; margin-top: 14px; padding: 40px 24px;
  border: 2px dashed var(--imp-primary-glow); border-radius: 16px; background: var(--imp-surface); text-align: center;
  transition: background var(--imp-ease), border-color var(--imp-ease);
}
.dropzone:hover, .dropzone.is-over, .dropzone:focus-within { background: var(--imp-primary-wash); border-color: var(--imp-primary); }
.dropzone__icon { font-size: 38px; color: var(--imp-primary-strong); }
.dropzone input[type="file"] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.dropzone__text { margin: 6px 0 0; font-size: 17px; font-weight: 700; color: var(--imp-ink); }
.dropzone__hint { margin: 0; font-size: 13px; color: var(--imp-muted); }
.dropzone__file {
  position: relative; z-index: 2; margin-top: 10px; padding: 8px 14px; border-radius: 10px;
  background: var(--imp-primary-wash); border: 1px solid var(--imp-primary-wash-2); color: var(--imp-primary-strong); font-size: 13px;
}
.dropzone__file[hidden] { display: none; }
.dropzone--link { color: inherit; text-decoration: none; }
.dropzone--link:hover { text-decoration: none; }
.tiny-note { display: flex; align-items: flex-start; gap: 8px; margin: 10px 0 0; font-size: 14px; color: var(--imp-secondary); }
.tiny-note .bi { color: var(--imp-primary-strong); }

.jobs { margin-top: 18px; }
.jobs__head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 8px; }
.jobs__title { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 13px; font-weight: 800; color: var(--imp-ink); }
.jobs__title .bi { color: var(--imp-primary-strong); }
.jobs__count { padding: 2px 8px; border-radius: 8px; background: var(--imp-primary); color: var(--imp-primary-ink); font-size: 11px; font-weight: 900; }
.jobs__head > :last-child:not(.jobs__title):not(.jobs__count) { margin-left: auto; }
.job-card { min-width: 0; margin-bottom: 10px; padding: 14px 18px; background: var(--imp-surface); border: 1px solid var(--imp-rule); border-radius: 14px; box-shadow: var(--imp-shadow); transition: border-color .2s; }
.job-card--running { border-color: var(--imp-primary-glow); box-shadow: 0 4px 16px var(--imp-primary-wash-2); }
.job-card--done { border-color: var(--imp-green-wash); }
.job-card--failed { border-color: var(--imp-red-wash); }
.job-card__head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; min-width: 0; }
.job-card__file { display: flex; align-items: center; gap: 6px; min-width: 0; margin: 0; font-weight: 800; font-size: 13px; color: var(--imp-ink); overflow-wrap: anywhere; }
.job-card__file .bi { color: var(--imp-primary-strong); }
.job-card__head > .btn-quiet, .job-card__head > a:last-child { margin-left: auto; }
.job-badge { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: 8px; font-size: 11px; font-weight: 900; white-space: nowrap; }
.job-badge--ready { background: var(--imp-green-wash); color: var(--imp-green); }
.job-badge--running { background: var(--imp-primary-wash-2); color: var(--imp-primary-strong); }
.job-badge--needs { background: var(--imp-amber-wash); color: var(--imp-amber); }
.job-badge--failed { background: var(--imp-red-wash); color: var(--imp-red); }
.job-badge--waiting { background: var(--imp-bg); color: var(--imp-muted); }
.job-badge--mapped { background: var(--imp-primary-wash); color: var(--imp-primary-strong); font-size: 10px; font-weight: 800; }
.job-card__options { display: grid; gap: 6px; grid: auto-flow / repeat(auto-fit, minmax(min(100%, 220px), 1fr)); margin-top: 10px; }
.job-card__options select, .job-card__product {
  width: 100%; min-height: 40px; padding: 8px 12px; border: 1px solid var(--imp-rule-strong); border-radius: 10px;
  background: var(--imp-surface); color: var(--imp-ink); font: inherit; font-size: 13px;
}
.job-card__product { display: flex; align-items: center; margin: 0; overflow-wrap: anywhere; }
.job-card__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; }
.job-card__actions form { display: contents; }
.job-card__note { font-size: 14px; color: var(--imp-secondary); }
.job-card__note--warn { color: var(--imp-amber); font-size: 12px; font-weight: 700; }
.job-card__hint { margin: 8px 0 0; font-size: 12px; color: var(--imp-muted); }
.job-card__stats { margin: 12px 0 6px; font-size: 11px; font-weight: 800; color: var(--imp-muted); }
.job-card__stats strong { color: var(--imp-ink); }
.side-switch { display: flex; gap: 4px; margin-bottom: 8px; }
.side-switch[hidden] { display: none; }
.side-switch__item {
  display: inline-flex; align-items: center; gap: 3px; padding: 2px 10px; border-radius: 8px; cursor: pointer;
  border: 1.5px solid var(--imp-primary); background: transparent; color: var(--imp-primary-strong); font: inherit; font-size: 11px; font-weight: 700;
}
.side-switch__item--on { background: var(--imp-primary); color: var(--imp-primary-ink); }
.job-preview { max-height: 320px; overflow: auto; border: 1px solid var(--imp-rule); border-radius: 10px; }
.job-preview .imp-table { font-size: 12px; }
.job-preview .imp-table th { position: sticky; top: 0; z-index: 1; }
.imp-table tr.row-skipped td { background: var(--imp-red-wash); }
.imp-table tr.row-skipped td:first-child { box-shadow: inset 4px 0 0 var(--imp-red); }
.job-progress { margin-top: 10px; }
.job-progress progress {
  display: block; width: 100%; height: 8px; border: 0; border-radius: 999px; overflow: hidden;
  -webkit-appearance: none; appearance: none; background: var(--imp-rule);
}
.job-progress progress::-webkit-progress-bar { background: var(--imp-rule); border-radius: 999px; }
.job-progress progress::-webkit-progress-value { background: linear-gradient(90deg, var(--imp-primary-2), var(--imp-primary)); border-radius: 999px; transition: width .3s; }
.job-progress progress::-moz-progress-bar { background: linear-gradient(90deg, var(--imp-primary-2), var(--imp-primary)); border-radius: 999px; }
.job-progress__row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px; margin: 4px 0 0; font-size: 12px; font-weight: 600; color: var(--imp-muted); }
.job-downloads { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; }
.job-downloads[hidden] { display: none; }
.done-banner { margin-top: 12px; padding: 16px 20px; border-radius: 14px; background: var(--imp-green-wash); border: 1.5px solid var(--imp-green-wash); text-align: center; }
.done-banner[hidden] { display: none; }
.done-banner__title { display: flex; justify-content: center; align-items: center; gap: 6px; margin: 0; font-weight: 900; font-size: 14px; color: var(--imp-green); }
.done-banner__sub { margin: 4px 0 0; font-size: 12px; color: var(--imp-muted); }
.done-banner__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 12px; }

/* ---------- veils (modals); :target opens one without scripts ---------- */
.veil { position: fixed; inset: 0; z-index: 200; display: none; align-items: center; justify-content: center; padding: 20px; overflow-y: auto; background: var(--imp-ink-frame); }
.veil--open, .veil:target { display: flex; }
.veil-skip:target ~ .veil--mismatch, .veil-skip:target ~ .veil--map, .veil--map:target ~ .veil--mismatch { display: none; }
.veil-skip { position: fixed; top: 0; }
.veil__box {
  width: min(520px, calc(100vw - 32px)); max-height: 90vh; overflow-y: auto; margin: auto; padding: 24px 26px;
  background: var(--imp-surface); color: var(--imp-text); border: 1px solid var(--imp-rule); border-radius: 18px; box-shadow: var(--imp-shadow-md);
}
.veil__box--lg { width: min(740px, calc(100vw - 32px)); }
.veil__head { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--imp-rule); }
.veil__head > .bi { flex: none; margin-top: 2px; font-size: 20px; }
.veil__icon--warn { color: var(--imp-amber); }
.veil__icon--gold { color: var(--imp-primary-strong); }
.veil__icon--red { color: var(--imp-red); }
.veil__title { margin: 0; font-size: 17px; font-weight: 900; line-height: 1.3; color: var(--imp-ink); }
.veil__sub { margin: 3px 0 0; font-size: 13px; line-height: 1.5; color: var(--imp-muted); }
.veil__section { margin-bottom: 12px; padding: 12px 14px; border-radius: 10px; background: var(--imp-bg); border: 1px solid var(--imp-rule); }
.veil__section--error { background: var(--imp-red-wash); border-color: var(--imp-red-wash); }
.veil__section--ok { background: var(--imp-green-wash); border-color: var(--imp-green-wash); color: var(--imp-green); font-size: 12px; font-weight: 700; }
.veil__section--tint { background: var(--imp-primary-wash); border-color: var(--imp-primary-wash-2); }
.veil__label { margin: 0 0 8px; font-size: 12px; font-weight: 800; color: var(--imp-red); }
.veil__ask { margin: 0 0 8px; font-size: 11px; font-weight: 800; letter-spacing: .05em; color: var(--imp-muted); }
.veil__small { margin: 10px 0 0; font-size: 11px; line-height: 1.5; color: var(--imp-muted); }
.veil__small .bi { color: var(--imp-primary-strong); margin-right: 4px; }
.veil__foot { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin-top: 16px; }
.veil .chip-row { margin: 0; gap: 4px; }
.choice-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.choice {
  display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1.5px solid var(--imp-rule); border-radius: 12px;
  background: var(--imp-surface); color: var(--imp-text); text-align: left; text-decoration: none; transition: all .15s;
}
.choice:hover, .choice:focus-visible { border-color: var(--imp-primary); background: var(--imp-primary-wash); box-shadow: 0 2px 8px var(--imp-primary-wash-2); text-decoration: none; }
.choice__icon { display: grid; place-items: center; width: 40px; height: 40px; flex: none; border-radius: 10px; background: var(--imp-primary-wash-2); color: var(--imp-primary-strong); font-size: 18px; }
.choice__title { display: block; font-weight: 800; font-size: 13px; color: var(--imp-ink); }
.choice__desc { display: block; margin-top: 2px; font-size: 11px; color: var(--imp-muted); }
.choice__go { margin-left: auto; flex: none; color: var(--imp-muted); }
.map-sample { margin-bottom: 14px; max-height: 140px; overflow: auto; border: 1px solid var(--imp-rule); border-radius: 10px; }
.map-sample__title { margin: 0 0 6px; font-size: 12px; font-weight: 800; color: var(--imp-secondary); }
.map-sample .imp-table { font-size: 11px; }
.map-sample .imp-table th, .map-sample .imp-table td { padding: 6px 10px; white-space: nowrap; }
.map-grid { display: grid; grid: auto-flow / minmax(0, 1fr) 30px minmax(0, 1fr); gap: 6px 8px; align-items: center; padding: 4px 0; }
.map-group { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; margin: 10px 0 0; padding: 10px 12px; border-radius: 10px; background: var(--imp-primary-wash); border: 1px solid var(--imp-primary-wash-2); font-size: 12px; font-weight: 800; letter-spacing: .03em; color: var(--imp-primary-strong); }
.map-cols { grid-column: 1 / -1; display: grid; grid: auto-flow / minmax(0, 1fr) 30px minmax(0, 1fr); gap: 8px; font-size: 11px; font-weight: 700; color: var(--imp-muted); padding: 6px 4px 0; }
.map-field label { font-size: 13px; font-weight: 600; color: var(--imp-ink); }
.map-field__opt { font-size: 11px; color: var(--imp-muted); }
.map-arrow { text-align: center; color: var(--imp-muted); }
.map-pick select { width: 100%; min-height: 38px; padding: 7px 12px; border: 1.5px solid var(--imp-rule-strong); border-radius: 10px; font-size: 12px; font-weight: 600; }
.map-pick select[aria-invalid="true"] { border-color: var(--imp-red); background: var(--imp-red-wash); }
.map-pick .field-error { margin: 4px 0 0; font-size: 11px; }
.imp-dialog.veil__box { padding: 20px 22px; }
.imp-dialog .veil__head { margin-bottom: 10px; }
@media (max-width: 640px) {
  .gen-shell { padding: 16px; }
  .dropzone { padding: 28px 14px; }
  .veil__box { padding: 18px 16px; }
  .map-grid, .map-cols { grid: auto-flow / minmax(0, 1fr); gap: 4px; }
  .map-arrow, .map-cols span:nth-child(2) { display: none; }
  .map-pick { margin-bottom: 8px; }
}
/* the confirm dialog wears the veil box */
.imp-dialog { width: min(460px, calc(100vw - 24px)); padding: 18px 20px; border-radius: 16px; box-shadow: var(--imp-shadow-md); }
.imp-dialog__warn { color: var(--imp-red); font-weight: 900; }
.cell-stack > .chip { align-self: flex-start; }

/* ---- P21 admin dashboard: laid out like the platform's own admin dashboard (filters card,
   a row of three tiles, a row of six, then three trend tables), in Imperium's gold/espresso. ---- */
.adm-dash__refresh { display: inline-flex; align-items: center; gap: 8px; }
.adm-dash__failed { margin-bottom: 18px; }
.adm-dash__filters { margin-bottom: 18px; }
.adm-dash__filters .section-card-title { margin-bottom: 14px; }
.adm-dash__form { margin-bottom: 14px; }
.adm-dash__form .btn-imp-primary { display: inline-flex; align-items: center; gap: 8px; }
.adm-dash__chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.adm-chip {
  display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 6px 14px;
  border: 1px solid var(--imp-rule-strong); border-radius: 999px; background: var(--imp-surface);
  color: var(--imp-secondary); font-size: var(--fs-1); font-weight: 700; text-decoration: none;
}
.adm-chip .bi { color: var(--imp-primary-strong); }
.adm-chip:hover { background: var(--imp-primary-wash); border-color: var(--imp-primary); }
.adm-chip--on { background: var(--imp-primary-wash-2); border-color: var(--imp-primary); color: var(--imp-ink); }
.adm-kpis { display: grid; gap: 14px; margin-bottom: 14px; }
.adm-kpis--three { grid: auto-flow / repeat(3, minmax(0, 1fr)); }
.adm-kpis--four { grid: auto-flow / repeat(4, minmax(0, 1fr)); margin-bottom: 18px; }
.metric-card__icon--green { background: var(--imp-green-wash); color: var(--imp-green); }
.metric-card__icon--red { background: var(--imp-red-wash); color: var(--imp-red); }
.metric-card__icon--teal { background: var(--imp-green-wash); color: var(--imp-wa); }
.adm-tick--ok { color: var(--imp-green); font-weight: 700; }
.adm-tick--wait { color: var(--imp-amber); font-weight: 700; }
.adm-tick--bad { color: var(--imp-red); font-weight: 700; }
.adm-trends { display: grid; gap: 18px; grid: auto-flow / repeat(2, minmax(0, 1fr)); }
.adm-trends > .section-card + .section-card { margin-top: 0; }
.adm-trends__wide { grid-column: 1 / -1; }
.adm-trend__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.adm-trend__head .small-note { margin: 4px 0 0; }
.adm-trend__icon { font-size: 20px; color: var(--imp-primary-strong); }
.adm-trend__barcol { width: 34%; }
.adm-bar { display: block; width: 100%; height: 8px; }
.adm-bar__track { fill: var(--imp-rule); }
.adm-bar__fill { fill: var(--imp-primary); }
.adm-bar__fill--teal { fill: var(--imp-wa); }
@media (max-width: 1100px) {
  .adm-kpis--four { grid: auto-flow / repeat(2, minmax(0, 1fr)); }
  .adm-trends { grid: auto-flow / minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .adm-kpis--three, .adm-kpis--four { grid: auto-flow / repeat(2, minmax(0, 1fr)); gap: 10px; }
  .adm-kpis--three > .metric-card:first-child { grid-column: 1 / -1; }
  .adm-kpis .metric-card { padding: 14px 12px 14px 18px; column-gap: 8px; }
  .adm-kpis .metric-card__icon { width: 30px; height: 30px; font-size: 15px; border-radius: 10px; }
  .adm-kpis .metric-card__value { font-size: var(--fs-3); overflow-wrap: normal; }
  .adm-trend td.when { text-align: left; font-weight: 700; }
  .adm-trend__barcol { width: auto; }
  .adm-trend td.adm-trend__barcol { padding-top: 6px; }
}