:root { --ink:#050507; --paper:#f3f0e9; --violet:#8d6cff; --acid:#d7ef21; --red:#ff4a55; --line:rgba(243,240,233,.22); --mono:"Courier New",ui-monospace,monospace; }
* { box-sizing:border-box; }
[hidden] { display:none!important; }
body.modal-open { overflow:hidden; }
html { scroll-behavior:smooth; background:var(--ink); max-width:100%; overflow-x:hidden; }
body { margin:0; background:var(--ink); color:var(--paper); font-family:Arial,Helvetica,sans-serif; max-width:100%; overflow-x:hidden; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.11; z-index:10; background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.16) 4px); mix-blend-mode:overlay; }
a { color:inherit; text-decoration:none; }
.skip { position:fixed; left:-999px; top:1rem; z-index:20; background:var(--acid); color:var(--ink); padding:.7rem 1rem; }
.skip:focus { left:1rem; }
.topbar { height:68px; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; padding:0 2rem; font:12px var(--mono); letter-spacing:.12em; position:relative; z-index:5; }
.header-mark { display:block; width:74px; line-height:0; }.header-mark img { display:block; width:100%; height:auto; }.header-mark:hover { opacity:.76; }
nav { display:flex; gap:1.6rem; text-transform:uppercase; align-items:center; } nav a:hover,.social-trigger:hover,.updates-trigger:hover { color:var(--acid); }.social-trigger,.updates-trigger { appearance:none; border:0; padding:0; background:none; color:inherit; font:inherit; letter-spacing:inherit; text-transform:inherit; cursor:pointer; }.updates-trigger { color:var(--acid); }
.social-backdrop { position:fixed; inset:0; z-index:30; display:grid; place-items:center; padding:1rem; background:rgba(2,2,5,.82); backdrop-filter:blur(12px); animation:modal-in .18s ease-out; }.social-modal { width:min(580px,100%); max-height:calc(100vh - 2rem); overflow:auto; border:1px solid var(--violet); background:#08080d; padding:1.2rem; box-shadow:0 0 0 1px rgba(215,239,33,.14),0 30px 100px #000; clip-path:polygon(0 0,96% 0,100% 6%,100% 100%,4% 100%,0 94%); }.modal-head { display:flex; justify-content:space-between; align-items:center; padding-bottom:1rem; border-bottom:1px solid var(--line); color:var(--violet); font:10px var(--mono); letter-spacing:.16em; }.modal-head button { display:grid; place-items:center; width:34px; height:34px; border:1px solid var(--line); background:transparent; color:var(--paper); font-size:24px; cursor:pointer; }.modal-head button:hover,.modal-head button:focus-visible { border-color:var(--acid); color:var(--acid); outline:none; }.modal-status { margin:1rem 0; color:var(--acid); font:10px var(--mono); letter-spacing:.13em; }.modal-status span { display:inline-block; width:7px; height:7px; margin-right:.6rem; background:var(--acid); box-shadow:0 0 10px var(--acid); }.social-modal h2 { margin:1.5rem 0 2rem; font-size:clamp(3rem,10vw,6.5rem); line-height:.76; letter-spacing:-.075em; }.social-list { border:1px solid var(--line); }.social-list a { display:grid; grid-template-columns:2rem 1fr auto 1.5rem; align-items:center; gap:.8rem; min-height:64px; padding:.8rem 1rem; border-bottom:1px solid var(--line); transition:.15s; }.social-list a:last-child { border-bottom:0; }.social-list a:hover,.social-list a:focus-visible { background:var(--acid); color:var(--ink); outline:none; }.social-list span,.social-list small { font:10px var(--mono); letter-spacing:.1em; }.social-list span { color:var(--violet); }.social-list strong { font-size:1rem; }.social-list b { font-size:1.1rem; }.modal-foot { margin:1rem 0 0; text-align:right; color:#898292; font:9px var(--mono); letter-spacing:.12em; }@keyframes modal-in { from { opacity:0; } to { opacity:1; } }
.updates-modal { width:min(680px,100%); }.updates-modal h2 { font-size:clamp(3.2rem,9vw,7rem); }.updates-copy { max-width:540px; color:#bdb6c2; font-size:1.05rem; line-height:1.55; margin:-.5rem 0 1.8rem; }.updates-form { border:1px solid var(--line); padding:1rem; background:#050507; }.updates-form>label { display:block; color:var(--violet); font:10px var(--mono); letter-spacing:.14em; margin-bottom:.6rem; }.updates-form>div { display:grid; grid-template-columns:1fr auto; }.updates-form input { min-width:0; border:1px solid var(--line); border-right:0; background:#0b0b10; color:var(--paper); padding:1rem; font-size:16px; }.updates-form input:focus { outline:1px solid var(--acid); border-color:var(--acid); }.updates-form button { border:0; background:var(--acid); color:var(--ink); padding:0 1.3rem; font:700 11px var(--mono); letter-spacing:.11em; cursor:pointer; }.updates-form button:hover { background:var(--paper); }.updates-privacy { color:#77717e; font:9px/1.55 var(--mono); margin:1rem 0 0; }.updates-privacy a { color:var(--violet); text-decoration:underline; }
.hero { min-height:calc(100vh - 68px); display:grid; grid-template-columns:46% 54%; border-bottom:1px solid var(--line); overflow:hidden; }
.hero-copy { min-width:0; padding:clamp(2.5rem,5vw,6rem) 2rem 2.5rem; position:relative; z-index:2; background:linear-gradient(90deg,var(--ink) 75%,transparent); }
.system-label { font:11px var(--mono); color:var(--violet); letter-spacing:.16em; margin:0 0 1.5rem; }
h1 { margin:0; width:min(100%,720px); } h1 img { display:block; width:100%; height:auto; }
.manifesto { font:clamp(2.1rem,4.3vw,4.6rem)/.89 Arial,sans-serif; letter-spacing:-.055em; margin:1.6rem 0 2.4rem; color:var(--violet); }.manifesto span { color:var(--acid); }
.signal-card { width:min(560px,100%); min-width:0; overflow:hidden; border:1px solid var(--line); background:rgba(3,3,6,.82); padding:1rem; clip-path:polygon(0 0,97% 0,100% 18%,100% 100%,3% 100%,0 82%); }
.signal-head,.track-top,.track-bottom { display:flex; justify-content:space-between; gap:1rem; font:10px var(--mono); letter-spacing:.12em; }.signal-head span { color:var(--acid); }.signal-head b { font-size:14px; }
.wave { color:var(--violet); letter-spacing:3px; overflow:hidden; white-space:nowrap; padding:1rem 0; font:20px var(--mono); }
.listen { display:flex; align-items:center; gap:1rem; background:var(--acid); color:var(--ink); padding:1rem; font:700 13px var(--mono); letter-spacing:.11em; }.listen b { margin-left:auto; font-size:18px; }.listen:hover { background:var(--paper); }
.portrait-field { min-width:0; min-height:690px; position:relative; isolation:isolate; overflow:hidden; background:radial-gradient(circle at 70% 45%,rgba(107,71,255,.52),transparent 42%),linear-gradient(140deg,#110a28 0%,#08080d 65%); }
.portrait-field::before { content:""; position:absolute; inset:0; background:linear-gradient(120deg,transparent 48%,rgba(141,108,255,.12) 48% 49%,transparent 49%),repeating-linear-gradient(90deg,transparent 0 89px,rgba(255,255,255,.05) 90px); }
.portrait-glow { position:absolute; width:55%; aspect-ratio:1; right:0; bottom:5%; background:radial-gradient(circle,var(--violet),transparent 67%); filter:blur(40px); opacity:.45; }
.portrait { position:absolute; height:94%; width:100%; object-fit:cover; object-position:center 20%; bottom:0; right:0; filter:contrast(1.06) saturate(1.04); mask-image:linear-gradient(to bottom,#000 82%,transparent 100%); }
.target { position:absolute; border:1px solid rgba(215,239,33,.48); width:44%; aspect-ratio:1; transform:rotate(45deg); }.target-a { right:2%; top:8%; }.target-b { left:8%; bottom:5%; width:28%; border-color:rgba(141,108,255,.5); }
.portrait-note { position:absolute; font:11px var(--mono); letter-spacing:.13em; z-index:2; }.note-top { top:1.4rem; right:2rem; color:var(--acid); }.note-side { right:1rem; top:47%; writing-mode:vertical-rl; color:var(--violet); }.botanical { position:absolute; right:2rem; bottom:2rem; font:10px/1.4 var(--mono); color:var(--violet); }
.archive { padding:5rem 2rem; background:linear-gradient(180deg,#050507,#0c0717); }.section-heading { display:flex; justify-content:space-between; align-items:end; gap:2rem; margin-bottom:2rem; }.section-heading p { font:11px var(--mono); color:var(--acid); }.section-heading h2,.about h2 { margin:0; font-size:clamp(2rem,4vw,4.8rem); line-height:.9; letter-spacing:-.055em; text-align:right; }
.track-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }.track { min-height:290px; padding:1.2rem; background:#09090d; display:flex; flex-direction:column; position:relative; transition:.2s; }.track:hover,.track.active { background:#151027; }.track.active::before { content:""; position:absolute; inset:0; border:1px solid var(--acid); pointer-events:none; }.track-top { color:#aaa1b8; }.track-top span:last-child { color:var(--acid); }.track strong { margin-top:auto; font-size:clamp(1.6rem,3vw,3rem); letter-spacing:-.055em; }.track p { color:#aba5b3; line-height:1.5; min-height:3em; }.track-bottom { border-top:1px solid var(--line); padding-top:1rem; color:var(--violet); }.track-bottom b { color:var(--acid); }
.world { min-height:65vh; display:grid; align-content:center; padding:6rem max(2rem,8vw); background:radial-gradient(circle at 75% 40%,rgba(141,108,255,.26),transparent 36%),#07070a; border-block:1px solid var(--line); }.creed { display:grid; width:min(1150px,100%); }.creed span { color:var(--acid); font:clamp(.72rem,1.2vw,1rem) var(--mono); letter-spacing:.18em; margin-bottom:1.4rem; }.creed strong { font-size:clamp(3.5rem,9vw,9rem); line-height:.78; letter-spacing:-.075em; font-weight:800; }.creed strong:last-child { color:var(--violet); margin-left:clamp(0rem,7vw,7rem); }.world-meta { display:flex; gap:.7rem; margin-top:2.5rem; flex-wrap:wrap; }.world-meta span { border:1px solid var(--line); padding:.55rem .8rem; font:10px var(--mono); color:var(--acid); }
.about { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:end; padding:6rem 2rem; }.about h2 { text-align:left; }.about>p { color:#c3bdc8; font-size:clamp(1.1rem,2vw,1.5rem); line-height:1.6; max-width:650px; }
.contact { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(2rem,7vw,8rem); padding:6rem 2rem; border-top:1px solid var(--line); background:linear-gradient(135deg,#0d0717,#050507 56%); }.contact-intro h2 { margin:0; font-size:clamp(3.4rem,7vw,7rem); line-height:.76; letter-spacing:-.07em; }.contact-intro>p:not(.system-label) { max-width:440px; margin:2rem 0 1rem; color:#aaa4b0; line-height:1.6; }.contact-intro>a { color:var(--acid); font:12px var(--mono); border-bottom:1px solid currentColor; }.contact-form { display:grid; grid-template-columns:1fr 1fr; gap:1rem; align-self:start; }.contact-form label { display:grid; gap:.45rem; }.contact-form label:nth-of-type(4) { grid-column:1/-1; }.contact-form label span { color:var(--violet); font:10px var(--mono); letter-spacing:.14em; }.contact-form input,.contact-form select,.contact-form textarea { width:100%; border:1px solid var(--line); border-radius:0; background:#08080d; color:var(--paper); padding:.9rem; font:15px Arial,sans-serif; }.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus { outline:1px solid var(--acid); border-color:var(--acid); }.contact-form textarea { resize:vertical; }.contact-form button { grid-column:1/-1; min-height:52px; border:0; background:var(--acid); color:var(--ink); font:700 12px var(--mono); letter-spacing:.12em; cursor:pointer; }.contact-form button:hover { background:var(--paper); }.contact-form button:disabled { opacity:.55; cursor:wait; }.form-response { grid-column:1/-1; min-height:1.2em; color:var(--acid); font:10px var(--mono); letter-spacing:.1em; }.contact-form small { grid-column:1/-1; color:#77717e; font:10px/1.5 var(--mono); }
footer { border-top:1px solid var(--line); padding:1.3rem 2rem; display:flex; justify-content:space-between; gap:1rem; color:#98919d; font:10px var(--mono); letter-spacing:.1em; }
@media (max-width:900px) { .hero { grid-template-columns:1fr; }.portrait-field { min-height:65vh; grid-row:1; }.hero-copy { margin-top:-12rem; background:linear-gradient(transparent,var(--ink) 25%); padding-top:12rem; }.track-grid { grid-template-columns:1fr 1fr; }.about,.contact { grid-template-columns:1fr; }.section-heading { align-items:start; flex-direction:column; }.section-heading h2 { text-align:left; } }
@media (max-width:600px) { .topbar { padding:0 1rem; }.topbar nav { gap:.65rem; font-size:8px; }.topbar nav a[href="#about"],.topbar nav a[href="#world"] { display:none; }.header-mark { width:58px; }.hero-copy,.archive,.about,.contact { padding-left:1rem; padding-right:1rem; }.hero-copy>* { max-width:100%; }.portrait-field { min-height:55vh; }.portrait { height:100%; }.note-top { left:1rem; right:1rem; text-align:right; font-size:9px; }.manifesto { font-size:clamp(1.8rem,8.5vw,2.35rem); white-space:nowrap; }.signal-head b { font-size:12px; white-space:nowrap; }.wave { max-width:100%; }.track-grid { grid-template-columns:1fr; }.track { min-height:230px; }.world { padding:5rem 1rem; }.about,.contact { gap:2rem; }.contact-form { grid-template-columns:1fr; }.contact-form label:nth-of-type(4),.contact-form button,.form-response,.contact-form small { grid-column:1; } footer { flex-direction:column; padding:1rem; }.social-list a { grid-template-columns:1.5rem 1fr 1.2rem; }.social-list small { display:none; }.updates-form>div { grid-template-columns:1fr; }.updates-form input { border-right:1px solid var(--line); }.updates-form button { min-height:48px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none!important; } }