/* 🚦 PROGRESS ON EVERY WAIT — the wait window, the pill, the busy control and the ✓ outcome
   (cmp_progress0001 rev 7). ONE stylesheet, loaded by every served surface beside /progress.js.
   Every colour reads the surface's own tokens with a Kosmos fallback, so the window belongs to the
   page it is on (criterion 9): --mint / --accent, --card, --line2, --text, --dim, --faint, --panel,
   --sky, --coral, --r, --shadow. Z-ORDER: above .overlay modals (80) and .toast (99), below
   #verbanner (9999) — see the ordinal in style.css. */
.kwin{position:fixed;inset:0;z-index:9998;display:none;pointer-events:none}
.kwin.on{display:block}
.kwin-veil{position:absolute;inset:0;background:rgba(6,10,18,.72);backdrop-filter:blur(3px);opacity:0;transition:opacity .22s ease}
/* only a content build veils the app — veiling it to save a note would be worse than the silence it replaces */
.kwin.overlay .kwin-veil{opacity:1;pointer-events:auto}
.kwin-card{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);
  width:min(460px,calc(100vw - 36px));background:var(--card,#12141c);border:1px solid var(--line2,rgba(147,160,180,.28));
  border-radius:var(--r,16px);box-shadow:0 24px 70px rgba(2,6,16,.65);padding:20px 22px 16px;color:var(--text,#e9eef7);
  pointer-events:auto;animation:kwinIn .22s cubic-bezier(.2,.9,.3,1)}
@keyframes kwinIn{from{opacity:0;transform:translate(-50%,-46%) scale(.97)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.kwin.min .kwin-card,.kwin.min .kwin-veil{display:none}
.kwin-eyebrow{display:flex;align-items:center;gap:8px;font:600 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.14em;text-transform:uppercase;color:var(--mint,var(--accent,#4fe3c1));margin-bottom:10px}
.kwin-step{font-size:17px;line-height:1.35;color:var(--text,#e9eef7);letter-spacing:-.01em;margin-bottom:14px;text-wrap:balance}
/* rev 6: the SECOND line says what is actually happening, in plain words; the flavour line is the
   surface's own voice under it on the overlay — never alone */
.kwin-hint{font-size:13.5px;line-height:1.4;color:var(--dim,#93a0b4);margin:-8px 0 12px}
.kwin-flavour{font-size:12.5px;line-height:1.3;font-style:italic;color:var(--faint,#5b6778);margin:-6px 0 12px}
.kwin-hint:empty,.kwin-flavour:empty{display:none}
.kwin-track{height:3px;border-radius:3px;background:var(--panel,rgba(255,255,255,.06));overflow:hidden}
.kwin-track i{display:block;height:100%;width:38%;transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,var(--mint,var(--accent,#4fe3c1)),var(--sky,#6ec7f5),transparent);
  animation:kwinsweep 1.1s cubic-bezier(.4,0,.2,1) infinite}
@keyframes kwinsweep{0%{transform:translateX(-100%)}100%{transform:translateX(350%)}}
.kwin-track i.det{animation:none;transform:none;background:linear-gradient(90deg,var(--mint,var(--accent,#4fe3c1)),var(--sky,#6ec7f5));transition:width .22s ease}
.kwin-meta{font:11.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--faint,#5b6778);
  margin-top:9px;font-variant-numeric:tabular-nums}
/* rev 7: a wait that started while a failure card is up is SAID on the card, with its own clock */
.kwin-meanwhile{font-size:12.5px;line-height:1.4;color:var(--dim,#93a0b4);margin-top:10px;font-variant-numeric:tabular-nums}
.kwin-meanwhile:empty{display:none}
.kwin-acts{display:flex;gap:8px;justify-content:flex-end;margin-top:14px}
.kwin-btn{border:1px solid var(--line2,rgba(147,160,180,.28));border-radius:9px;padding:6px 13px;font-size:13px;color:var(--dim,#93a0b4);background:transparent;cursor:pointer}
.kwin-btn:hover{border-color:var(--mint,var(--accent,#4fe3c1));color:var(--text,#e9eef7)}
.kwin-btn:focus-visible{outline:2px solid var(--mint,var(--accent,#4fe3c1));outline-offset:2px}
/* while it runs you may park it; once it has a result you close it (or it closes itself), and closing
   ends the cycle — nothing lingers until new work starts */
.kwin-close{display:none}
/* an OVERLAY is not minimisable: there is nothing behind it to go back to */
.kwin.overlay #kwin-min{display:none}
.kwin.done .kwin-close,.kwin.fail .kwin-close{display:inline-block;border-color:var(--mint,var(--accent,#4fe3c1));color:var(--text,#e9eef7)}
.kwin.done #kwin-min,.kwin.fail #kwin-min{display:none}
.kwin.done .kwin-eyebrow{color:var(--mint,var(--accent,#4fe3c1))}
.kwin.done .kwin-dot{animation:none}
.kwin.fail .kwin-close{border-color:var(--coral,#fb7185)}
.kwin.fail .kwin-eyebrow{color:var(--coral,#fb7185)}
.kwin.fail .kwin-track i{background:var(--coral,#fb7185)}
.kwin.fail .kwin-dot{background:var(--coral,#fb7185);animation:none}
/* minimised: a pill at the foot of the screen, still centred, still visible */
.kwin-pill{display:none;position:absolute;left:50%;bottom:18px;transform:translateX(-50%);
  align-items:center;gap:9px;max-width:min(420px,calc(100vw - 32px));pointer-events:auto;
  background:var(--card,#12141c);border:1px solid var(--line2,rgba(147,160,180,.28));border-radius:999px;padding:8px 16px;
  box-shadow:var(--shadow,0 12px 40px rgba(2,6,16,.55));font-size:13px;color:var(--text,#e9eef7);cursor:pointer}
.kwin.min .kwin-pill{display:flex}
.kwin-pill:hover{border-color:var(--mint,var(--accent,#4fe3c1))}
.kwin-pill span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kwin-dot{width:7px;height:7px;border-radius:50%;background:var(--mint,var(--accent,#4fe3c1));flex:0 0 auto;animation:kpulse 1.15s ease-in-out infinite}
@keyframes kpulse{0%,100%{opacity:.35}50%{opacity:1}}
/* the control that started the work says so ITSELF — "did my tap land?" is a different question from
   "is the app busy?", so it gets its own answer */
button[data-busy]{position:relative;color:transparent!important;pointer-events:none;opacity:.75}
button[data-busy]::after{content:"";position:absolute;inset:0;margin:auto;width:13px;height:13px;border:2px solid var(--line2,rgba(147,160,180,.28));border-top-color:var(--mint,var(--accent,#4fe3c1));border-radius:50%;animation:kspin .6s linear infinite}
@keyframes kspin{to{transform:rotate(360deg)}}
/* rev 7: a quick write that never showed a window confirms ON the control — a ✓ badge for a moment */
button[data-done]{position:relative}
button[data-done]::after{content:attr(data-done);position:absolute;left:50%;top:-8px;transform:translate(-50%,-100%);
  white-space:nowrap;font-size:12px;font-weight:600;line-height:1;color:var(--mint,var(--accent,#4fe3c1));
  background:var(--card,#12141c);border:1px solid var(--mint,var(--accent,#4fe3c1));border-radius:999px;padding:5px 10px;
  box-shadow:0 8px 24px rgba(2,6,16,.45);pointer-events:none;z-index:9997;animation:kdone 1.6s ease forwards}
@keyframes kdone{0%{opacity:0;transform:translate(-50%,-88%)}12%,78%{opacity:1;transform:translate(-50%,-100%)}100%{opacity:0;transform:translate(-50%,-100%)}}
/* Slow or still the motion — never remove the feedback, which is the point. */
@media (prefers-reduced-motion:reduce){
  .kwin-card{animation:none}
  .kwin-track i{animation-duration:2.6s}
  .kwin-veil{transition:none}
  .kwin-dot{animation:none;opacity:.9}
  button[data-busy]::after{animation-duration:1.8s}
  button[data-done]::after{animation:none;opacity:1}
}
