:root{
--u:8px;--fs:13px;--lh:20px;--ease:cubic-bezier(.22,1,.36,1)}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink)}
body{font:400 var(--fs)/var(--lh) "JetBrains Mono",ui-monospace,Menlo,monospace;font-feature-settings:"zero" 0,"calt" 0;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;min-height:100svh;display:flex;flex-direction:column}
p,ol,dl,dd{margin:0;padding:0}ol{list-style:none}
.dim{color:var(--dim)}em{font-style:normal;color:var(--mid)}
a{color:inherit;text-decoration:none}
:focus-visible{outline:1px solid var(--ink);outline-offset:4px}
::selection{background:var(--acc);color:var(--bg)}
.grain{position:fixed;inset:0;pointer-events:none;z-index:9;opacity:.05;background:repeating-linear-gradient(0deg,#fff 0 1px,transparent 1px 3px);mix-blend-mode:overlay}

.top{display:flex;justify-content:space-between;align-items:center;padding:calc(var(--u)*3) calc(var(--u)*3) calc(var(--u)*2);max-width:752px;width:100%;margin:0 auto}
.brand{display:inline-flex;gap:var(--u);align-items:center;letter-spacing:.02em}
.brand svg{width:16px;height:16px;color:var(--ink)}
.top nav a{color:var(--mid);font-size:12px;letter-spacing:.08em}

.wrap{max-width:752px;width:100%;margin:0 auto;padding:0 calc(var(--u)*3);flex:1}
.tab{display:flex;gap:var(--u);align-items:center;height:32px;padding:0 calc(var(--u)*1.5);background:var(--tab);border:1px solid var(--line);border-bottom:0;font-size:12px;color:var(--mid)}
.tab .arrow{margin-left:auto;color:var(--dim)}

.frame{border:1px solid var(--line2);background:var(--panel);padding:calc(var(--u)*2);position:relative}
.frame::before,.frame::after{content:"";position:absolute;width:5px;height:5px;border:1px solid var(--mid)}
.frame::before{left:-3px;bottom:-3px;border-width:0 0 1px 1px}.frame::after{right:-3px;bottom:-3px;border-width:0 1px 1px 0}
.frame-head{display:flex;justify-content:space-between;font-size:11px;letter-spacing:.06em;color:var(--mid)}
.frame-head b{color:var(--ink);font-weight:500;margin-right:var(--u)}
.sky{position:relative;height:256px;margin:calc(var(--u)*2) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
background:repeating-linear-gradient(0deg,transparent 0 7px,rgba(var(--glow),.035) 7px 8px)}
#sky{position:absolute;inset:0;width:100%;height:100%}
.axis{position:absolute;left:0;right:0;top:28%;display:flex;align-items:center;gap:var(--u);font-size:10px;color:var(--mid);pointer-events:none}
.axis i{flex:1;height:1px;background:repeating-linear-gradient(90deg,var(--mid) 0 10px,transparent 10px 14px,var(--mid) 14px 16px,transparent 16px 20px);opacity:.55;transform-origin:left}
.boot{position:absolute;left:calc(var(--u)*2);bottom:calc(var(--u)*2);font-size:12px;line-height:20px;color:var(--mid)}
.boot li{opacity:0}
.ok{display:inline-block;width:32px;color:var(--ok)}
.rule{display:flex;justify-content:space-between;font-size:10px;color:var(--dim);padding:0 2px}
.frame-foot{display:flex;gap:var(--u);font-size:11px;margin-top:var(--u)}

.term{padding:calc(var(--u)*4) 0 calc(var(--u)*5)}
.blk+.blk{margin-top:calc(var(--u)*3)}
.pr{color:var(--mid)}
.cmd{color:var(--ink)}
.ty.on::after,.cur{display:inline-block;width:.6em;height:1.05em;vertical-align:-2px;background:var(--ink);margin-left:2px}
.ty.on::after{content:""}
.cur{animation:blink 1.1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.out .ln{opacity:0}
.stats .ln{display:grid;grid-template-columns:12ch 8ch 1fr}
.stats dd{color:var(--acc);text-align:right;padding-right:2ch;font-variant-numeric:tabular-nums}
.links{display:flex;flex-wrap:wrap;gap:var(--u) calc(var(--u)*3)}
.lnk{position:relative;color:var(--ok);background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat;padding-bottom:1px;transition:color .3s var(--ease),background-size .45s var(--ease)}
.lnk:hover{color:var(--ink);background-size:0 1px;background-position:100% 100%}
.top nav .lnk{color:var(--mid);background-size:0 1px}.top nav .lnk:hover{background-size:100% 1px;background-position:0 100%}

.bar{border-top:1px solid var(--line2);padding:calc(var(--u)*2) calc(var(--u)*3) calc(var(--u)*3 + env(safe-area-inset-bottom));display:flex;justify-content:space-between;align-items:flex-end;max-width:752px;width:100%;margin:0 auto}
.title{letter-spacing:.12em;font-weight:500}.sub{font-size:11px}
.vis{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.vis p{display:flex;gap:calc(var(--u)*2);font-size:11px}.label{color:var(--dim);letter-spacing:.12em}
.vis b{color:var(--acc);font-weight:400;font-variant-numeric:tabular-nums}
#spark{width:120px;height:20px;display:block}
#spark rect{fill:var(--mid)}

@media (max-width:480px){:root{--fs:12.5px}.sky{height:208px}.top,.wrap,.bar{padding-left:calc(var(--u)*2.5);padding-right:calc(var(--u)*2.5)}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.boot li,.out .ln{opacity:1!important}}
/* v3 ambient */
.frame::before,.frame::after{display:none}
.cm{position:absolute;width:6px;height:6px;border:0 solid var(--mid);pointer-events:none}
.cm.tl{left:-3px;top:-3px;border-width:1px 0 0 1px}.cm.tr{right:-3px;top:-3px;border-width:1px 1px 0 0}
.cm.bl{left:-3px;bottom:-3px;border-width:0 0 1px 1px}.cm.br{right:-3px;bottom:-3px;border-width:0 1px 1px 0}
.log{position:absolute;right:calc(var(--u)*2);bottom:calc(var(--u)*2);margin:0;padding:0;list-style:none;font-size:10px;line-height:16px;color:var(--dim);text-align:right;pointer-events:none}
.log li{white-space:nowrap}
.reticle{position:absolute;left:0;top:0;width:16px;height:16px;margin:-8px 0 0 -8px;border:1px solid rgba(224,115,106,.35);opacity:0;pointer-events:none}
.reticle::after{content:"";position:absolute;left:50%;top:50%;width:2px;height:2px;margin:-1px;background:var(--acc)}
.frame-foot .push{margin-left:auto}
.frame-foot,.stats dd,#up{font-variant-numeric:tabular-nums}
.cur,.ty.on::after{animation:blink 1.1s steps(1) infinite,breathe 3.2s ease-in-out infinite;box-shadow:0 0 0 rgba(217,211,195,0)}
@keyframes breathe{50%{box-shadow:0 0 10px rgba(var(--glow),.35)}}
.stats dd,.vis b{transition:text-shadow .6s var(--ease)}
.pulse{text-shadow:0 0 8px rgba(224,115,106,.7)}
body.idle .term,body.idle .top,body.idle .tab{opacity:.55;transition:opacity 1.6s var(--ease)}
.term,.top,.tab{transition:opacity .5s var(--ease)}
.hero{will-change:transform}
@media (max-width:480px){.log{display:none}.frame-foot{flex-wrap:wrap}}
@media (prefers-reduced-motion:reduce){.log,.reticle{display:none}}

.tn{display:flex;gap:24px;align-items:center}.top nav .lnk{color:var(--mid)}

@media (max-width:480px){.tn{gap:12px}.top{gap:8px}.top nav a,.theme-btn{font-size:11.5px}.brand{white-space:nowrap}}

.vis.off b{color:var(--dim)}.vis.off::after{content:"offline";font-size:10px;color:var(--dim)}