@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:local('JetBrains Mono Regular'),local('JetBrainsMono-Regular'),url(fonts/jetbrains-mono-400.woff) format('woff')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:700;font-display:swap;src:local('JetBrains Mono Bold'),local('JetBrainsMono-Bold'),url(fonts/jetbrains-mono-700.woff) format('woff')}
@font-face{font-family:'Symbols Mono';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/symbols-mono.woff) format('woff');unicode-range:U+2605,U+2606,U+2661,U+2665}
:root{--accent:#ff7a1f;--line:#3b2313;--muted:#a8968a;--panel:#100b08;--text:#f2e8de;--ok:#63d27f}
html{scroll-behavior:smooth}
body{margin:0;background:#0a0705;color:#f2e8de;font-family:'JetBrains Mono','Symbols Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
*{box-sizing:border-box}
::selection{background:#ff7a1f;color:#140a03}
a{color:#ff7a1f;text-decoration:none}
a:hover{color:#ffa060}

.bg-grid{position:absolute;left:0;right:0;top:0;height:900px;pointer-events:none;background-image:linear-gradient(color-mix(in srgb,var(--accent) 7%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--accent) 7%,transparent) 1px,transparent 1px);background-size:48px 48px;-webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 0%,#000 25%,transparent 80%);mask-image:radial-gradient(ellipse 80% 70% at 50% 0%,#000 25%,transparent 80%)}
.crt{position:fixed;left:0;right:0;top:0;bottom:0;pointer-events:none;z-index:50;background:repeating-linear-gradient(to bottom,rgba(255,255,255,0.03) 0,rgba(255,255,255,0.03) 1px,transparent 1px,transparent 3px),radial-gradient(ellipse at center,transparent 62%,rgba(0,0,0,0.5) 100%)}

.nav-link{display:inline-block;position:relative;padding:12px 4px;color:var(--muted);transition:color .2s}
.nav-link:hover{color:var(--text)}
.nav-link::after{content:"";position:absolute;left:0;right:0;bottom:8px;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .25s}
.nav-link:hover::after{transform:scaleX(1)}
button.nav-link{background:none;border:0;font:inherit;cursor:pointer}
.nav-link.is-on{color:var(--accent)}
.nav-link.is-on::after{transform:scaleX(1)}
.brand{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0;background:none;border:0;color:var(--text);font:inherit;font-weight:700;cursor:pointer}
.view{animation:view-in .5s cubic-bezier(.2,.7,.2,1)}
@keyframes view-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;font:inherit;font-weight:500;border:1px solid var(--accent);cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s,color .2s}
.btn:hover{transform:translateY(-2px)}
.btn-fill{background:var(--accent);color:#140a03}
.btn-fill:hover{color:#140a03;box-shadow:0 0 28px color-mix(in srgb,var(--accent) 55%,transparent)}
.btn-ghost{background:transparent;color:var(--accent)}
.btn-ghost:hover{background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent)}

.win{position:relative;border:1px solid color-mix(in srgb,var(--accent) 42%,#000);background:rgba(16,11,8,0.72)}
.tag{position:absolute;top:-11px;left:16px;padding:0 8px;background:#0a0705;color:var(--accent);font-size:13px;line-height:20px}

.cursor{display:inline-block;width:.62ch;height:1.05em;background:var(--accent);vertical-align:-0.16em;margin-left:3px;box-shadow:0 0 14px var(--accent);animation:blink 1.06s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.glow{text-shadow:0 0 22px color-mix(in srgb,var(--accent) 50%,transparent)}
.up{opacity:0;animation:up .8s cubic-bezier(.2,.7,.2,1) forwards}
@keyframes up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

.glitch{display:inline-block}
.glitch:hover{animation:glitch .4s steps(2) 1}
@keyframes glitch{0%{text-shadow:3px 0 #ff2e63,-3px 0 #26d0ce;transform:translateX(0)}25%{transform:translateX(-3px)}50%{text-shadow:-3px 0 #ff2e63,3px 0 #26d0ce;transform:translateX(3px)}75%{transform:translateX(-1px)}100%{text-shadow:none;transform:none}}

.bar{flex:1;height:100%;background:var(--accent);transform-origin:bottom;transform:scaleY(.2);animation:eq 1.2s ease-in-out infinite}
.bar:nth-child(2n){animation-duration:.9s;animation-delay:-.3s}
.bar:nth-child(3n){animation-duration:1.5s;animation-delay:-.7s}
.bar:nth-child(5n){animation-duration:1.1s;animation-delay:-.1s}
.bar:nth-child(7n){animation-duration:1.7s;animation-delay:-1s}
@keyframes eq{0%,100%{transform:scaleY(.12)}50%{transform:scaleY(1)}}

.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 10px var(--ok);animation:pulse 2s ease-in-out infinite;vertical-align:1px}
@keyframes pulse{50%{opacity:.35}}

.card{position:relative;overflow:hidden;transition:transform .25s,border-color .25s,box-shadow .25s}
.card:hover{transform:translateY(-5px);border-color:var(--accent) !important;box-shadow:0 22px 50px -24px color-mix(in srgb,var(--accent) 60%,transparent)}
.card::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:0}
.card:hover::before{opacity:.9;animation:scan 1.6s linear infinite}
@keyframes scan{from{top:0}to{top:100%}}
.link{display:inline-flex;align-items:center;min-height:44px;gap:8px;transition:gap .2s}
.link:hover{gap:14px}

.chip{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border:1px solid color-mix(in srgb,var(--accent) 45%,#000);color:var(--text);font-size:14px;transition:background .2s,border-color .2s}
.chip:hover{background:color-mix(in srgb,var(--accent) 14%,transparent);border-color:var(--accent)}

.qbtn{min-height:44px;padding:0 16px;background:transparent;color:var(--accent);border:1px solid color-mix(in srgb,var(--accent) 45%,#000);font:inherit;font-size:14px;cursor:pointer;transition:background .2s,border-color .2s}
.qbtn:hover{background:color-mix(in srgb,var(--accent) 14%,transparent);border-color:var(--accent)}
.term-in{flex:1;min-width:0;min-height:44px;background:transparent;border:0;outline:0;color:var(--text);font:inherit;caret-color:var(--accent)}
.term-row:focus-within{background:color-mix(in srgb,var(--accent) 7%,transparent)}
#term-out{scrollbar-width:thin;scrollbar-color:var(--accent) transparent}
.tl{min-height:1.65em;white-space:pre-wrap;word-break:break-word}
.tl-new{animation:tl-in .35s ease both}
@keyframes tl-in{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}
.t-acc{color:var(--accent)}
.t-hi{color:var(--accent);text-shadow:0 0 12px color-mix(in srgb,var(--accent) 60%,transparent)}
.t-dim{color:var(--muted)}
.t-err{color:#ff8a7a}
.t-big{font-size:1.45em;line-height:1;vertical-align:-.1em}
.t-link{color:var(--accent);text-decoration:underline;text-underline-offset:3px}

@media (max-width:600px){
  .online{display:none}
}
@media (max-width:920px){
  .g2{grid-template-columns:minmax(0,1fr) !important}
  .g3{grid-template-columns:minmax(0,1fr) !important}
  .pad{padding-left:20px !important;padding-right:20px !important}
  .big-name{font-size:34px !important}
  .big-head{font-size:24px !important}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important}
  .up{opacity:1 !important}
  .bar{transform:scaleY(.5)}
}

/* --- standalone additions --- */
[hidden]{display:none !important}
main:focus{outline:none}
a.brand{color:var(--text)}
.nav-link[aria-current="page"]{color:var(--accent)}
.nav-link[aria-current="page"]::after{transform:scaleX(1)}
html.js .view{display:none}
html.js .view.active{display:block}
html.pre #view-home{visibility:hidden}
html.js .hero-rest:not(.shown){opacity:0}
.hero-rest.shown{animation:up .8s cubic-bezier(.2,.7,.2,1) forwards}
.term-in::placeholder{color:var(--muted);opacity:.8}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.term-in:focus-visible{outline:none}

/* --- element styles (extracted from inline styles so a strict CSP works) --- */
.u1{position:relative; width:100%; min-height:100vh; display:flex; flex-direction:column; overflow-x:hidden}
.u2{position:sticky; top:0; z-index:20; background:rgba(10,7,5,0.8); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-bottom:1px solid var(--line)}
.u3{max-width:1200px; margin:0 auto; padding:0 40px; min-height:60px; display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap}
.u4{color:var(--accent)}
.u5{color:var(--muted); font-weight:400}
.u6{display:flex; align-items:center; gap:24px; flex-wrap:wrap}
.u7{color:var(--muted); font-size:13px}
.u8{position:relative; z-index:1; flex:1}
.u9{max-width:1200px; margin:0 auto; padding:88px 40px 80px; width:100%}
.u10{display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); gap:56px; align-items:start}
.u11{min-height:28px; color:var(--muted)}
.u12{min-height:80px; margin-top:12px}
.u13{margin:0; font-size:60px; line-height:1.1; font-weight:700; color:var(--accent); letter-spacing:-0.02em}
.u14{min-height:52px; margin-top:8px; font-size:34px; line-height:1.3; font-weight:400; color:var(--text)}
.u15{margin:28px 0 0; max-width:560px; color:var(--muted)}
.u16{display:flex; gap:16px; flex-wrap:wrap; margin-top:36px}
.u17{display:flex; flex-direction:column; gap:36px; padding-top:12px}
.u18{animation-delay:.4s; padding:26px 24px 20px}
.u19{display:grid; grid-template-columns:auto 1fr; column-gap:16px; row-gap:6px; font-size:14px}
.u20{color:var(--muted)}
.u21{color:var(--accent); font-variant-numeric:tabular-nums}
.u22{animation-delay:.6s; padding:26px 24px 20px}
.u23{display:flex; flex-direction:column; font-size:14px}
.u24{animation-delay:.8s; padding:26px 24px 20px}
.u25{display:flex; align-items:flex-end; gap:3px; height:64px}
.u26{max-width:1200px; margin:0 auto; padding:72px 40px; width:100%}
.u27{display:flex; align-items:center; gap:14px; margin-bottom:40px}
.u28{margin:0; font-size:22px; font-weight:400}
.u29{flex:1; height:1px; background:var(--line)}
.u30{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px}
.u31{border:1px solid var(--line); background:var(--panel); padding:28px 26px 12px; display:flex; flex-direction:column; gap:16px; min-height:320px}
.u32{margin:0; font-size:19px; font-weight:700; color:var(--accent)}
.u33{margin:0; color:var(--muted); font-size:14px; flex-grow:1}
.u34{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:40px}
.u35{display:flex; flex-direction:column; gap:36px}
.u36{padding:30px 26px 26px}
.u37{margin:0; color:var(--text)}
.u38{padding:30px 26px 22px}
.u39{margin:0 0 8px; color:var(--text)}
.u40{display:flex; flex-wrap:wrap; gap:10px}
.u42{max-width:1200px; margin:0 auto; padding:72px 40px 96px; width:100%}
.u43{padding:28px 0 0; background:rgba(12,8,5,0.9)}
.u44{height:400px; overflow-y:auto; padding:4px 26px 12px; font-size:14px}
.u45{display:flex; flex-wrap:wrap; gap:10px; padding:10px 26px; border-top:1px solid var(--line)}
.u46{align-self:center; color:var(--muted); font-size:13px}
.u47{display:flex; align-items:center; gap:10px; padding:0 26px; border-top:1px solid var(--line)}
.u48{color:var(--accent); white-space:nowrap}
.u49{max-width:1200px; margin:0 auto; padding:0 40px 40px; color:var(--muted)}
.u50{position:relative; z-index:1; border-top:1px solid var(--line)}
.u51{max-width:1200px; margin:0 auto; padding:0 40px; min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; color:var(--muted); font-size:13px}
.u52{display:flex; flex-direction:column; gap:24px}
.u53{margin:0 0 12px; font-size:13px; font-weight:400}

/* --- a11y + terminal additions --- */
.sr-only{position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0}
.masked{color:transparent}
