/* hack-yourself: the day tracer. */

.hyt{min-width:0}
.hyt .toy{margin:3rem 0}

/* ---------- shared bits ---------- */
.hyt .hyt-lede{max-width:56ch;margin-bottom:1.2rem}
.hyt .hyt-app{display:none}
html.js .hyt .hyt-app{display:block}
html.js .hyt .hyt-static{display:none}
.hyt .hyt-static{display:block}

.hyt .hyt-status{font:.73rem/1.5 var(--mono);color:var(--muted);min-width:0;overflow-wrap:anywhere}
.hyt .hyt-empty{margin:.55rem .1rem;font:.75rem/1.5 var(--mono);color:var(--muted);font-style:italic}
.hyt .hyt-empty[hidden]{display:none}

/* ---------- chips ---------- */
.hyt .hyt-chips{display:grid;grid-template-columns:repeat(auto-fit,minmax(205px,1fr));gap:.85rem 1.2rem;margin:0 0 1rem}
.hyt .hyt-group{min-width:0}
.hyt .hyt-group-title{display:block;margin:0 0 .4rem;font:.64rem/1.3 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--accent2)}
.hyt .hyt-group-list{display:flex;flex-wrap:wrap;gap:.4rem}
.hyt .hyt-chip{padding:.32rem .55rem;font-size:.76rem;line-height:1.35;text-align:left;transition:border-color .15s,background .15s,color .15s}
.hyt .hyt-chip[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--bg)}
.hyt .hyt-chip[aria-pressed="true"]:hover{color:var(--bg)}
.hyt .hyt-chip:active{transform:none}
.hyt .hyt-run.is-dirty::after{content:"●";margin-left:.4rem;font-size:.7em;vertical-align:.15em;color:var(--accent3)}

/* ---------- trace stage ---------- */
.hyt .hyt-stage{margin-top:.35rem;background:var(--code);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.hyt .hyt-stagebar{display:flex;align-items:center;gap:.7rem;padding:.42rem .7rem;border-bottom:1px solid var(--line);background:var(--surface2);font:.66rem/1.4 var(--mono);color:var(--muted);min-width:0}
.hyt .hyt-lights{flex:none;display:inline-flex;gap:.24rem}
.hyt .hyt-lights i{width:.42rem;height:.42rem;border-radius:50%;background:var(--line)}
.hyt .hyt-lights i:first-child{background:var(--accent)}
.hyt .hyt-lights i:nth-child(2){background:var(--accent3)}
.hyt .hyt-file{color:var(--fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hyt .hyt-legend{margin-left:auto;white-space:nowrap;font-size:.62rem;letter-spacing:.02em}
.hyt .hyt-log{list-style:none;margin:0;padding:.5rem .35rem .55rem;max-height:18rem;overflow:auto;font:.71rem/1.55 var(--mono);font-variant-numeric:tabular-nums;scrollbar-width:thin}
.hyt .hyt-log:empty{display:none}
.hyt .hyt-line{display:grid;grid-template-columns:11.5ch 12ch minmax(0,1fr) auto;gap:.55rem;align-items:baseline;margin:0;padding:.14rem .4rem;border-left:2px solid transparent;border-radius:4px;overflow-wrap:anywhere}
.hyt .hyt-line + .hyt-line{margin-top:0}
.hyt .hyt-line.is-up{border-left-color:var(--accent);background:color-mix(in oklab,var(--accent) 7%,transparent)}
.hyt .hyt-line.is-down{border-left-color:var(--muted);background:color-mix(in oklab,var(--muted) 5%,transparent)}
.hyt .hyt-line.is-flat{border-left-color:var(--line)}
.hyt .hyt-time{color:var(--muted);white-space:nowrap}
.hyt .hyt-addr{color:var(--accent2);white-space:nowrap;opacity:.85}
.hyt .hyt-call{color:var(--fg);min-width:0}
.hyt .hyt-delta{white-space:nowrap;color:var(--muted);font-weight:500}
.hyt .hyt-line.is-up .hyt-delta{color:var(--fg)}
.hyt .hyt-delta .is-plus{color:var(--accent)}
.hyt .hyt-delta .is-minus{color:var(--muted)}
.hyt .hyt-line.is-up .hyt-dir{color:var(--accent)}
.hyt .hyt-line.is-down .hyt-dir{color:var(--muted)}
.hyt .hyt-dir{margin-right:.15rem;font-size:.85em}
.hyt .hyt-log.hyt-log-static{max-height:none}
.hyt .hyt-line{animation:hyt-row-in .22s ease-out both}
@keyframes hyt-row-in{from{opacity:0;translate:0 4px}to{opacity:1;translate:0 0}}
.hyt .hyt-stagefoot{display:flex;align-items:center;justify-content:space-between;gap:.7rem;padding:.38rem .7rem;border-top:1px dashed var(--line);font:.65rem/1.4 var(--mono);color:var(--muted);flex-wrap:wrap}

/* ---------- registers ---------- */
.hyt .hyt-regs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem 1.2rem;margin-top:1rem}
.hyt .hyt-regs .hyt-reg:last-child:nth-child(odd){grid-column:1/-1}
.hyt .hyt-reg{min-width:0;padding:.5rem .65rem;background:var(--surface2);border:1px solid var(--line);border-radius:9px}
.hyt .hyt-reg-joy{border-color:color-mix(in oklab,var(--accent3) 42%,var(--line))}
.hyt .hyt-reg-joy .hyt-reg-name{color:var(--accent3)}
.hyt .hyt-reg-joy .hyt-fill{background:linear-gradient(90deg,var(--accent3),var(--accent2))}
.hyt .hyt-reg-joy .hyt-delta.is-plus{color:var(--accent3)}
.hyt .hyt-reg-top{display:flex;align-items:baseline;justify-content:space-between;gap:.6rem}
.hyt .hyt-reg-name{font:.66rem/1.3 var(--mono);letter-spacing:.1em;color:var(--muted)}
.hyt .hyt-reg-side{display:inline-flex;align-items:baseline;gap:.4rem;font-variant-numeric:tabular-nums}
.hyt .hyt-reg-val{font:600 .86rem/1.3 var(--mono);color:var(--fg)}
.hyt .hyt-delta{font:.66rem/1.3 var(--mono);color:var(--muted)}
.hyt .hyt-delta.is-plus{color:var(--accent)}
.hyt .hyt-bar{position:relative;height:.5rem;margin-top:.4rem;background:var(--surface);border:1px solid var(--line);border-radius:99px;overflow:hidden}
.hyt .hyt-fill{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--accent2),var(--accent));transition:width .45s ease}
.hyt .hyt-mid{position:absolute;top:0;bottom:0;left:50%;border-left:1px dashed var(--line);opacity:.75}
.hyt .hyt-verdict{margin:.9rem 0 0;padding:.55rem .7rem;background:color-mix(in oklab,var(--accent) 6%,var(--surface2));border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:0 8px 8px 0;font:.8rem/1.55 var(--mono);color:var(--fg)}
.hyt .hyt-verdict:empty{display:none}

/* ---------- weights table ---------- */
.hyt .hyt-weights{margin-top:1rem}
.hyt .hyt-weights-details{margin:.5rem 0 0;border:1px solid var(--line);border-radius:9px;background:var(--surface2);overflow:hidden}
.hyt .hyt-weights-details summary{padding:.45rem .65rem;font:.73rem/1.4 var(--mono);color:var(--accent2);cursor:pointer;list-style-position:inside}
.hyt .hyt-weights-details summary:hover{color:var(--accent)}
.hyt .hyt-weights-scroll{overflow-x:auto;border-top:1px solid var(--line)}
.hyt .hyt-weights-table{width:100%;min-width:26rem;border-collapse:collapse;font:.72rem/1.4 var(--mono);margin:0}
.hyt .hyt-weights-table caption{text-align:left}
.hyt .hyt-weights-table th,.hyt .hyt-weights-table td{padding:.28rem .55rem;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}
.hyt .hyt-weights-table th[scope="row"]{text-align:left;font-family:var(--mono);font-weight:400;color:var(--fg);white-space:normal;background:transparent}
.hyt .hyt-weights-table thead th{font-family:var(--mono);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);background:var(--surface)}
.hyt .hyt-weights-table tbody tr:last-child th,.hyt .hyt-weights-table tbody tr:last-child td{border-bottom:0}
.hyt .hyt-w-neg{color:var(--muted)}
.hyt .hyt-w-zero{color:var(--muted);opacity:.55}

/* ---------- fallback ---------- */
.hyt .hyt-static .toy-fallback{margin:1rem 0 .8rem}

/* ---------- narrow ---------- */
@media(max-width:700px){
  .hyt .hyt-stagebar{flex-wrap:wrap;gap:.25rem .6rem}
  .hyt .hyt-legend{margin-left:0;flex-basis:100%;white-space:normal;font-size:.6rem}
  .hyt .hyt-line{grid-template-columns:auto auto;gap:.05rem .6rem;padding:.2rem .35rem}
  .hyt .hyt-call{grid-column:1/-1}
  .hyt .hyt-delta{grid-column:1/-1;font-size:.68rem}
  .hyt .hyt-log{font-size:.69rem}
}
@media(max-width:620px){
  .hyt .hyt-chips{grid-template-columns:1fr;gap:.7rem}
  .hyt .hyt-chips .hyt-group-list{gap:.35rem}
  .hyt .hyt-regs{grid-template-columns:1fr}
  .hyt .hyt-stagebar{flex-wrap:wrap;gap:.3rem .6rem}
  .hyt .hyt-file{flex:1 1 auto}
  .hyt .hyt-log{max-height:16rem}
  .hyt .hyt-weights-table{min-width:20rem}
  .hyt .hyt-weights-table th,.hyt .hyt-weights-table td{padding:.28rem .4rem}
}
@media(prefers-reduced-motion:reduce){
  .hyt .hyt-line{animation:none}
  .hyt .hyt-fill{transition:none}
}