/* /lead-attribution/backend-lead-file/ only (prefix bl-): the typing editor, the 3-second fuse,
   the roll call, the route map and the time-zone placer. Each mirrors kit/leads/skald-lead.*,
   skald_lead.py, conversions/reconcile.py and adapters.when. */

.bl-k{margin:0 0 .6rem;font:500 .68rem var(--sk-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--sk-text-3)}
.fold-paper .bl-k{color:#4a5866}

/* ---------- hero: the typing editor ---------- */
.bl-ed{border:1px solid var(--sk-line-2);border-radius:10px;background:var(--sk-deep);overflow:hidden}
.bl-bar{display:flex;justify-content:space-between;align-items:center;gap:.8rem;padding:.45rem .6rem .45rem .45rem;border-bottom:1px solid var(--sk-line);background:#0b1117}
.bl-tabs{display:flex;gap:.25rem;flex-wrap:wrap}
.bl-tabs button{padding:.35rem .7rem;border:1px solid transparent;border-radius:4px;background:none;color:var(--sk-text-3);font:500 .74rem var(--sk-mono);cursor:pointer}
.bl-tabs button[aria-checked="true"]{border-color:var(--sk-line-2);background:var(--sk-deep);color:var(--sk-text)}
.bl-tabs button:focus-visible,.bl-btn:focus-visible{outline:2px solid var(--sk-ai);outline-offset:1px}
.bl-btn{flex:none;padding:.25rem .55rem;border:1px solid var(--sk-line-2);border-radius:3px;background:none;color:var(--sk-text-2);font:500 .68rem var(--sk-mono);cursor:pointer}
.bl-code{margin:0;padding:1.2rem 1.1rem 1rem;min-height:7.2rem;box-sizing:border-box;font:400 .84rem/1.75 var(--sk-mono);color:var(--sk-text);white-space:pre-wrap;overflow-wrap:anywhere;background:linear-gradient(160deg,#1c2a36,#121b24)}
.bl-code .c{color:var(--sk-text-4)}
.bl-l{display:inline}
.bl-type.typing::after{content:"";display:inline-block;width:.55em;height:1.05em;margin-left:1px;vertical-align:-2px;background:var(--sk-ai);animation:blBlink 1s steps(1) infinite}
.bl-ret{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem;padding:.85rem 1.1rem 1rem;border-top:1px dashed var(--sk-line-2)}
.bl-bubble{display:inline-flex;align-items:center;gap:.5rem;padding:.35rem .75rem;border-radius:16px;background:rgba(27,175,122,.14);color:#7fd8b5;font:500 .82rem var(--sk-sans)}
.bl-bubble b{font:700 .85rem var(--sk-mono);color:#5fd3a6}
.bl-meta{font:400 .72rem var(--sk-mono);color:var(--sk-text-3)}
.bl-meta code{font-size:inherit}
.bl-ed.js .bl-bubble{transition:opacity .3s,transform .3s}
.bl-ed.js.wait .bl-bubble{opacity:0;transform:translateY(6px)}

/* ---------- 01: the fuse ---------- */
.bl-fuse{margin-top:1.5rem;padding:1.4rem;border:1px solid var(--sk-line-2);border-radius:8px;background:var(--sk-deep)}
.bl-scale{display:grid;grid-template-columns:repeat(3,1fr) 0;margin:0 9rem .4rem 9.5rem;font:500 .66rem var(--sk-mono);color:var(--sk-text-4)}
.bl-scale span{border-left:1px solid var(--sk-line);padding-left:.3rem;white-space:nowrap}
.bl-lanes{margin:0;padding:0;list-style:none;display:grid;gap:.7rem}
.bl-lanes li{display:grid;grid-template-columns:9rem minmax(0,1fr) 8.5rem;gap:.5rem;align-items:center}
.bl-lanes b{font:600 .92rem var(--sk-sans);color:var(--sk-text)}
.bl-lanes small{display:block;font:400 .7rem var(--sk-mono);color:var(--sk-text-4)}
.bl-wick{position:relative;height:12px;border-radius:6px;background:repeating-linear-gradient(90deg,#24323f 0 6px,#1b2731 6px 12px)}
.bl-wick i{position:absolute;left:0;top:0;bottom:0;width:var(--w,1.3%);border-radius:6px;background:var(--sk-search)}
.bl-wick i::after{content:"";position:absolute;right:-5px;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:#ffd2bf;box-shadow:0 0 10px 3px rgba(235,104,52,.6);opacity:0}
.bl-fuse.burn .bl-wick i{background:var(--sk-ai)}
.bl-fuse.burn .bl-wick i::after{opacity:1}
.bl-lanes li.no .bl-wick i{background:var(--sk-bots)}
.bl-res{font:600 .8rem var(--sk-mono);color:#5fd3a6}
.bl-lanes li.no .bl-res{color:#f0c35c}
.bl-why{margin-top:1rem;padding-top:.9rem;border-top:1px dashed var(--sk-line-2);font-size:.95rem;line-height:1.55;color:var(--sk-text-2)}
.bl-why p{margin:0}

/* ---------- 02: the roll call ---------- */
.bl-roll{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:1.25rem;margin-top:1.5rem;align-items:start}
.bl-mine,.bl-wire{padding:1.3rem;border:1px solid var(--sk-line-2);border-radius:8px;background:var(--sk-deep);min-width:0}
.bl-rows{margin:0;padding:0;list-style:none;display:grid;gap:.3rem}
.bl-rows li{display:grid;grid-template-columns:4.6rem 4.6rem minmax(0,1fr) auto;gap:.5rem;align-items:center;padding:.4rem .6rem;border:1px solid var(--sk-line);border-radius:4px;font-size:.86rem;color:var(--sk-text-2);transition:background .3s,border-color .3s}
.bl-rows code{font:600 .8rem var(--sk-mono);color:var(--sk-text)}
.bl-rows b{font:600 .66rem var(--sk-mono);text-transform:uppercase;letter-spacing:.05em}
.bl-rows li.have b{color:#5fd3a6}
.bl-rows li.miss{border-color:var(--sk-bots);background:rgba(237,161,0,.08)}
.bl-rows li.miss b{color:#f0c35c}
.bl-rows li.sent{border-color:var(--sk-search);background:rgba(27,175,122,.08);animation:blIn .6s ease-out}
.bl-rows li.sent b{color:#5fd3a6}
.bl-rows li.tst b{color:var(--sk-people-t)}
.bl-acts{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-top:1rem}
.bl-acts button[disabled]{opacity:.4;cursor:default}
.bl-reset{padding:.3rem .6rem;border:1px solid var(--sk-line-2);border-radius:3px;background:none;color:var(--sk-text-2);font:500 .72rem var(--sk-mono);cursor:pointer}
.bl-req{margin:0;padding:.9rem 1rem;border-radius:6px;background:#0b1117;border:1px solid var(--sk-line);font:400 .74rem/1.6 var(--sk-mono);color:var(--sk-text-2);white-space:pre-wrap;overflow-wrap:anywhere;max-height:22rem;overflow:auto}
.bl-req .h{color:var(--sk-text)}
.bl-req .g{color:#5fd3a6}
.bl-req .m{color:var(--sk-text-4)}
.bl-req.flash{animation:blFlash .6s ease-out}
.bl-say{margin:.9rem 0 0;font-size:.92rem;line-height:1.55;color:var(--sk-text-2)}

/* ---------- 03: the route map (on paper) ---------- */
.bl-pick{display:grid;gap:.7rem;justify-items:start;margin-top:1.4rem}
.bl-route{padding:1.3rem;border:1px solid var(--sk-paper-line);border-radius:8px;background:#fbf8f2;min-width:0;color:var(--sk-paper-ink)}
.bl-map{display:block;width:100%;height:auto}
.bl-map .m-srv{fill:#f1ece2;stroke:#c9bfae;stroke-dasharray:4 3}
.bl-map .m-k{font:600 9px var(--sk-mono);letter-spacing:.08em;fill:#4a5866}
.bl-map .m-node{fill:#fff;stroke:#c9bfae}
.bl-map .m-cf{fill:#fff5ec;stroke:#e6b796}
.bl-map .m-t{font:600 13px var(--sk-sans);fill:var(--sk-paper-ink)}
.bl-map .m-s{font:400 10px var(--sk-mono);fill:#4a5866}
.bl-map .m-p{fill:none;stroke:#c9bfae;stroke-width:2;stroke-dasharray:5 4;transition:stroke .3s}
.bl-map .m-x{font:700 14px var(--sk-sans);fill:var(--sk-bots);opacity:0;transition:opacity .3s}
.bl-route[data-road="public"] .p-out,.bl-route[data-road="allow"] .p-out,.bl-route[data-road="allow"] .p-in{stroke:var(--sk-ai);stroke-dasharray:none;animation:blDash 1s linear infinite}
.bl-route[data-road="public"] .p-out{stroke:var(--sk-bots)}
.bl-route[data-road="public"] .m-x{opacity:1}
.bl-route[data-road="local"] .p-local{stroke:var(--sk-search);stroke-dasharray:none}
.bl-route[data-road="local"] .m-sk,.bl-route[data-road="allow"] .m-sk{stroke:var(--sk-search);stroke-width:2}
.bl-url{margin:.9rem 0 0}
.bl-url .bl-k{display:block;margin-bottom:.3rem}
.bl-url code{font:500 .8rem var(--sk-mono);overflow-wrap:anywhere;color:var(--sk-paper-ink)}
.bl-res2{margin:.8rem 0 0;font-size:.92rem;line-height:1.5;color:var(--sk-paper-ink-2)}
.bl-res2 .tag{background:#fbe7c0;color:#8a5d00;border-color:#efc77a}
.bl-res2.ok .tag{background:#d5f0e4;color:#0b7a52;border-color:#9fd9bf}

/* ---------- 04: the time-zone placer ---------- */
.bl-tz{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:1.25rem;margin-top:1.5rem;align-items:start}
.bl-tz-in,.bl-tz-out{padding:1.3rem;border:1px solid var(--sk-line-2);border-radius:8px;background:var(--sk-deep);min-width:0}
.bl-tz-in{display:grid;gap:.8rem;justify-items:start}
.bl-tz-in .bl-k{margin:0}
.bl-tz-in input{width:100%;box-sizing:border-box;padding:.65rem .75rem;border:1px solid #33475a;border-radius:4px;background:#0b1117;color:var(--sk-text);font:500 .95rem var(--sk-mono)}
.bl-tz-in input:focus{outline:2px solid var(--sk-ai);outline-offset:1px;border-color:transparent}
.bl-days{margin:0 0 1rem;padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px}
.bl-days li{position:relative;height:4.2rem;padding:.45rem .5rem;border-radius:4px;background:#16212b;box-sizing:border-box}
.bl-days li::after{content:"";position:absolute;left:0;right:0;bottom:1.2rem;height:1px;background:var(--sk-line-2)}
.bl-days b{font:600 .78rem var(--sk-sans);color:var(--sk-text-2)}
.bl-days li.hit{background:#1c2c25}
.bl-days li.hit b{color:var(--sk-text)}
.bl-dot{position:absolute;bottom:calc(1.2rem - 6px);width:12px;height:12px;margin-left:-6px;border-radius:50%;background:var(--sk-search);box-shadow:0 0 0 4px rgba(27,175,122,.25);transition:left .4s}
.bl-dot.note{background:var(--sk-people);box-shadow:0 0 0 4px rgba(90,150,220,.25)}
.bl-arrive{position:absolute;bottom:.55rem;width:2px;height:2.2rem;margin-left:-1px;background:var(--sk-ai)}
.bl-arrive::after{content:"arrived";position:absolute;bottom:0;left:5px;font:500 .6rem var(--sk-mono);color:var(--sk-ai);white-space:nowrap}
.bl-days .bl-off{position:absolute;bottom:.4rem;font:500 .66rem var(--sk-mono);color:var(--sk-text-4)}
.bl-out{margin:0;font-size:.95rem;line-height:1.5;color:var(--sk-text)}
.bl-out .tag.no{background:rgba(237,161,0,.14);color:var(--sk-bots);border-color:rgba(237,161,0,.4)}
.bl-out.flash{animation:blFlash .6s ease-out}
.bl-log{margin:.7rem 0 0;font:400 .76rem/1.5 var(--sk-mono);color:var(--sk-text-3)}

/* ---------- 05 ---------- */
.bl-steps{margin:1.2rem 0 1rem;padding-left:1.2rem;display:grid;gap:.6rem;line-height:1.55;color:var(--sk-text-2)}
.bl-steps b{color:var(--sk-text)}

@keyframes blBlink{50%{opacity:0}}
@keyframes blFlash{0%{background:rgba(235,104,52,.22)}100%{background:transparent}}
@keyframes blIn{0%{transform:translateX(-8px);opacity:.3}100%{transform:none;opacity:1}}
@keyframes blDash{to{stroke-dashoffset:-18}}

@media (max-width:980px){
  .bl-roll,.bl-tz{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  .bl-scale{grid-template-columns:repeat(3,1fr) 0;margin:0 1.8rem .4rem 0}
  .bl-lanes .bl-wick{margin-right:1.8rem}
  .bl-lanes li{grid-template-columns:minmax(0,1fr) auto;gap:.3rem .6rem}
  .bl-lanes .bl-wick{grid-column:1 / -1;grid-row:2}
  .bl-rows li{grid-template-columns:4.4rem minmax(0,1fr) auto;font-size:.8rem}
  .bl-rows li span:nth-of-type(2){display:none}
}
@media (prefers-reduced-motion:reduce){
  .bl-map .m-p{animation:none !important}
  .bl-dot{transition:none}
}