/* stage.css v1.0.0 (2026-10-21) damir@rinet.one - /var/www/rinet.dev/assets/css/ - operations console, blueprint, giant-wordmark product list. Original artwork, no third-party assets. */
.st-sec{position:relative;overflow:hidden;color:var(--fg,#e6edf7)}
.st-wrap{position:relative;max-width:1240px;margin:0 auto;padding:0 24px}
.st-eb{font:600 11.5px 'JetBrains Mono',ui-monospace,monospace;letter-spacing:.2em;text-transform:uppercase;color:#67e8f9}
.st-h{font-size:clamp(32px,4.6vw,60px);line-height:1.05;letter-spacing:-.02em;margin:14px 0 10px;color:#f8fafc}
.st-p{max-width:640px;opacity:.78;font-size:17px;line-height:1.6}
/* console */
#console{padding:90px 0 110px;background:#04070d}
#console .cs-frame{position:relative;margin-top:36px;border:1px solid rgba(125,211,252,.22);border-radius:18px;overflow:hidden;background:#050a14;box-shadow:0 40px 120px -30px rgba(34,211,238,.28),0 0 0 1px rgba(255,255,255,.03) inset;transform:perspective(1600px) rotateX(2.5deg);transition:transform .8s}
#console .cs-frame:hover{transform:perspective(1600px) rotateX(0)}
#console .cs-bar{display:flex;gap:18px;align-items:center;padding:10px 16px;border-bottom:1px solid rgba(125,211,252,.14);font:11px 'JetBrains Mono',monospace;letter-spacing:.14em;color:#7dd3fc;background:rgba(8,16,30,.9)}
#console .cs-bar i{width:7px;height:7px;border-radius:50%;background:#34d399;box-shadow:0 0 10px #34d399;animation:vtblink 1.8s infinite}
#console .cs-bar span:last-child{margin-left:auto;opacity:.6}
#console .cs-body{display:grid;grid-template-columns:260px 1fr 250px;min-height:520px}
#console .cs-side{padding:16px;font:12px/1.5 'JetBrains Mono',monospace;border-right:1px solid rgba(125,211,252,.12);background:rgba(6,12,24,.85);overflow:hidden}
#console .cs-side.r{border-right:0;border-left:1px solid rgba(125,211,252,.12)}
#console .cs-t{color:#64748b;letter-spacing:.16em;font-size:10.5px;margin:2px 0 10px}
#console .cs-g{margin:0 0 11px}
#console .cs-g b{display:flex;justify-content:space-between;color:#cbd5e1;font-weight:500}
#console .cs-g em{font-style:normal;color:#67e8f9}
#console .cs-meter{height:3px;border-radius:2px;background:#0f1b2e;margin-top:5px;overflow:hidden}
#console .cs-meter u{display:block;height:100%;width:0;background:linear-gradient(90deg,#22d3ee,#818cf8);transition:width 1.4s cubic-bezier(.2,.8,.2,1)}
#console .cs-map{position:relative;background:#040810 url(/assets/img/contours.svg) center/cover;overflow:hidden}
#console .cs-map::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 60% at 50% 50%,transparent,#040810 95%);z-index:1;pointer-events:none}
#console canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0}
#console .cs-ov{position:absolute;z-index:2;font:10.5px 'JetBrains Mono',monospace;letter-spacing:.14em;color:#7dd3fc;opacity:.8}
#console .cs-big{font:600 34px 'JetBrains Mono',monospace;color:#f1f5f9;letter-spacing:0;margin:2px 0 2px}
#console .cs-k{margin:0 0 16px;color:#94a3b8}
#console .cs-ev{margin-top:6px;color:#94a3b8;height:150px;overflow:hidden;mask-image:linear-gradient(#000 60%,transparent)}
#console .cs-ev div{animation:csin .6s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@keyframes csin{from{opacity:0;transform:translateY(8px)}}
/* blueprint */
#blueprint{padding:100px 0;background:linear-gradient(180deg,#04070d,#08111f 50%,#04070d)}
#blueprint svg{width:100%;height:auto;margin-top:34px;display:block}
#blueprint .bp{fill:none;stroke:#7dd3fc;stroke-width:1.4}
#blueprint .bpl{fill:none;stroke:#818cf8;stroke-width:1.2;stroke-dasharray:6 7;animation:bpflow 1.6s linear infinite}
#blueprint .bpt{font:600 11px 'JetBrains Mono',monospace;letter-spacing:.14em;fill:#7dd3fc}
#blueprint .bps{font:11px 'JetBrains Mono',monospace;fill:#94a3b8}
#blueprint .draw{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2.4s cubic-bezier(.3,.7,.2,1)}
#blueprint.on .draw{stroke-dashoffset:0}
@keyframes bpflow{to{stroke-dashoffset:-26}}
/* giant wordmarks */
#wordlist{padding:100px 0;background:#04070d}
#wordlist .wl-row{display:grid;grid-template-columns:200px 1fr 120px;align-items:center;gap:20px;border-top:1px solid rgba(125,211,252,.16);padding:22px 0;position:relative;transition:background .4s}
#wordlist .wl-row:last-child{border-bottom:1px solid rgba(125,211,252,.16)}
#wordlist .wl-row:hover{background:linear-gradient(90deg,rgba(34,211,238,.07),transparent)}
#wordlist .wl-n{font:12px 'JetBrains Mono',monospace;color:#64748b;letter-spacing:.14em}
#wordlist .wl-n small{display:block;margin-top:6px;color:#94a3b8;font-size:11.5px;letter-spacing:.04em;max-width:170px;line-height:1.45}
#wordlist .wl-w{font-size:clamp(34px,5.6vw,80px);line-height:1;letter-spacing:-.035em;font-weight:500;color:#e2e8f0;transition:transform .5s,color .4s;white-space:nowrap;overflow:hidden;text-overflow:clip}
#wordlist .wl-row:hover .wl-w{transform:translateX(14px);color:#fff}
#wordlist .wl-c{text-align:right;font:600 28px 'JetBrains Mono',monospace;color:#67e8f9}
#wordlist .wl-c small{display:block;font-size:10.5px;color:#64748b;letter-spacing:.14em;font-weight:500}
[data-theme="light"] #console,[data-theme="light"] #blueprint,[data-theme="light"] #wordlist{filter:none}
@media (max-width:1000px){#console .cs-body{grid-template-columns:1fr}#console .cs-side{display:none}#wordlist .wl-row{grid-template-columns:1fr}#wordlist .wl-c{text-align:left}}
@media (max-width:820px){#console,#blueprint,#wordlist{display:none!important}}
@media (prefers-reduced-motion:reduce){.st-sec *{animation:none!important;transition:none!important}}

/* ---- hero layer (v1.1.0, 2026-10-21): drifting topography, scan line, HUD labels, live ticker ---- */
.hero{position:relative;isolation:isolate}
.hero .hx-bg{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.hero .hx-bg::before{content:"";position:absolute;inset:-8%;background:url(/assets/img/contours.svg) center/cover;opacity:.42;animation:hxdrift 80s ease-in-out infinite alternate}
.hero .hx-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(70% 60% at 72% 48%,rgba(34,211,238,.16),transparent 70%),linear-gradient(180deg,transparent 60%,var(--bg,#05080f))}
.hero .hx-scan{position:absolute;left:0;right:0;height:140px;top:-140px;background:linear-gradient(180deg,transparent,rgba(103,232,249,.10),transparent);animation:hxscan 9s linear infinite}
@keyframes hxdrift{from{transform:scale(1.04) translate(-1.5%,-1%)}to{transform:scale(1.14) translate(1.5%,1.5%)}}
@keyframes hxscan{to{top:110%}}
.hero .hx-hud{position:absolute;z-index:1;font:600 10.5px 'JetBrains Mono',ui-monospace,monospace;letter-spacing:.18em;color:#67e8f9;opacity:.75;pointer-events:none;text-transform:uppercase}
.hero .hx-hud.tl{right:24px;top:84px;text-align:right}.hero .hx-hud.br{right:24px;bottom:22px;text-align:right}
.hero .hx-hud i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#34d399;box-shadow:0 0 10px #34d399;margin-right:8px;animation:vtblink 1.8s infinite}
#hx-ticker{position:relative;overflow:hidden;border-top:1px solid rgba(125,211,252,.16);border-bottom:1px solid rgba(125,211,252,.16);background:rgba(4,8,16,.82);padding:13px 0;font:600 12px 'JetBrains Mono',ui-monospace,monospace;letter-spacing:.16em;color:#94a3b8;text-transform:uppercase}
#hx-ticker .tk{display:inline-flex;gap:56px;white-space:nowrap;padding-left:56px;animation:hxtk 70s linear infinite}
#hx-ticker .tk b{color:#e0f2fe;font-weight:600;margin-right:10px}
@keyframes hxtk{to{transform:translateX(-50%)}}
[data-theme="light"] .hero .hx-bg::before{opacity:.38;filter:saturate(.8) brightness(.55)}
[data-theme="light"] .hero .hx-hud{color:#0369a1}
[data-theme="light"] #hx-ticker{background:rgba(236,242,252,.92);color:#475569}[data-theme="light"] #hx-ticker .tk b{color:#0f172a}
@media (max-width:820px){.hero .hx-hud,#hx-ticker{display:none!important}.hero .hx-bg::before{opacity:.3}}
@media (prefers-reduced-motion:reduce){.hero .hx-bg::before,.hero .hx-scan,#hx-ticker .tk{animation:none!important}}
