/* Footer: sim.log report, link "ports", copyright, and the contact dialog. */
footer.end{position:relative;z-index:2;margin:0 auto;padding:90px clamp(18px,4vw,48px) 40px}
.rpt{max-width:720px;margin:0 auto;background:#161d24;border-radius:14px;overflow:hidden;box-shadow:0 30px 60px -34px rgba(20,14,6,.85),0 0 0 1px #0d1216}
.rpt-h{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;background:#0f151a;font:500 var(--t-label) var(--mono);color:#8fa0af;letter-spacing:.08em}
.rpt-h .dots{display:flex;gap:6px}
.rpt-h .dots i{width:9px;height:9px;border-radius:50%;background:#ff8c7a;opacity:.7}
.rpt-h .dots i:nth-child(2){background:#e0c26a}
.rpt-h .dots i:nth-child(3){background:#7fd1a0}
.rpt-b{margin:0;padding:20px 22px 6px;overflow-wrap:anywhere;font:400 13px/1.8 var(--mono);color:#c4cfd9;white-space:pre-wrap}
.rpt-b .c{color:#6f8191}
.rpt-b .k{color:#e08a58}
.rpt-b .g{color:#7fd1a0;font-weight:600}
.rpt-b b{color:#e08a58;font-weight:500}
.ports{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:16px 22px 22px}
.port{display:flex;align-items:center;justify-content:center;gap:10px;padding:14px 12px;border-radius:10px;border:1px solid #2c3843;background:#1d262f;color:#e9e2d0;text-decoration:none;font:600 var(--t-small) var(--sans);cursor:pointer;transition:background .25s,border-color .25s,transform .25s,color .25s}
.port svg{width:20px;height:20px;flex:none}
.port:hover{background:#a8481f;border-color:#a8481f;color:#fff;transform:translateY(-2px)}
.copy{text-align:center;margin:26px 0 0;font:400 var(--t-meta) var(--mono);color:var(--muted)}
.cdlg{margin:auto;border:0;padding:0;border-radius:16px;width:min(520px,calc(100vw - 32px));background:var(--card);color:var(--ink);box-shadow:0 40px 80px -30px rgba(20,14,6,.7)}
.cdlg::backdrop{background:rgba(22,29,36,.6);backdrop-filter:blur(3px)}
.cform{display:grid;gap:14px;padding:22px 24px 24px}
.cf-h{display:flex;justify-content:space-between;align-items:center}
.cf-h h3{font-family:var(--serif);font-weight:500;font-size:var(--t-h3);margin:0}
.cf-x{border:0;background:none;font-size:26px;line-height:1;cursor:pointer;color:var(--muted)}
.cform label{display:grid;gap:6px;font:500 var(--t-label) var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.cform input,.cform textarea{font:400 var(--t-body) var(--sans);color:var(--ink);background:#fffaf0;border:1px solid var(--rule);border-radius:9px;padding:11px 12px;text-transform:none;letter-spacing:0;resize:vertical}
.cform input:focus,.cform textarea:focus{outline:2px solid var(--cu);outline-offset:1px;border-color:var(--cu)}
.cform .hp{display:none}
.cf-f{display:flex;justify-content:space-between;align-items:center;gap:12px}
.cf-s{font:400 var(--t-meta) var(--mono);color:var(--muted)}
.cf-s.ok{color:#2f6f6a}
.cf-s.bad{color:#b3392b}
.cform .btn{border:0;cursor:pointer}
.cform .btn[disabled]{opacity:.6;cursor:default}
@media (max-width:640px){
  .ports{grid-template-columns:1fr}
  .rpt-b{font-size:11.5px;padding:16px}
}
footer.end{font-size:var(--t-meta)}
/* Back to top: a small round "sim clock". The ring fills as the page scrolls (0 to 4000 ns), ticks mark where each section starts, the centre shows the time. */
.totop{position:fixed;right:18px;bottom:18px;z-index:31;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:rgba(22,29,36,.94);color:#f1ebdc;text-decoration:none;box-shadow:0 10px 24px -10px rgba(0,0,0,.6);transition:transform .25s,background .25s,opacity .3s}
.totop svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.totop .trk{fill:none;stroke:#2c3843;stroke-width:3}
.totop .prog{fill:none;stroke:#e08a58;stroke-width:3;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset .15s linear}
.totop .in{position:relative;display:grid;justify-items:center;line-height:1}
.totop .in i{font:700 14px var(--sans);font-style:normal;color:#e08a58;transition:transform .3s}
.totop .in b{font:500 8.5px var(--mono);letter-spacing:.02em;color:#c4cfd9;margin-top:2px;font-variant-numeric:tabular-nums}
.totop .ticks line{stroke:#6f8191;stroke-width:1.6;stroke-linecap:round;transition:stroke .3s}
.totop .ticks line.on{stroke:#ffd9b8}
.totop .tip{position:absolute;right:calc(100% + 10px);top:50%;white-space:nowrap;padding:6px 10px;border-radius:99px;background:#161d24;color:#e0c26a;font:500 var(--t-label) var(--mono);font-style:normal;letter-spacing:.04em;opacity:0;transform:translate(4px,-50%);pointer-events:none;transition:opacity .25s,transform .25s}
.totop:hover,.totop:focus-visible{background:#a8481f;transform:translateY(-2px)}
.totop:hover .in i,.totop:focus-visible .in i{color:#fff;transform:translateY(-2px)}
.totop:hover .in b{color:#fff}
.totop:hover .tip,.totop:focus-visible .tip{opacity:1;transform:translate(0,-50%)}
.totop.top{opacity:.55}
@media (max-width:1100px){
  .totop{right:14px;bottom:14px;width:44px;height:44px}
}
@media (prefers-reduced-motion:reduce){
  .totop,.totop .prog,.totop .in i,.totop .tip{transition:none}
}