@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,700&family=Noto+Sans+SC:wght@400;500;700;900&display=swap');

:root { color-scheme: dark; }
* { box-sizing: border-box; }
html { min-width: 320px; }
body { margin: 0; font-family: 'DM Sans', 'Noto Sans SC', sans-serif; }
button, input { font: inherit; }
a { color: inherit; text-decoration: none; }
button { color: inherit; cursor: pointer; }
:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }

/* Portal */
.portal { --ink: #e8eee4; --acid: #d7fb30; min-height: 100svh; overflow: hidden; color: var(--ink); background: #090a0c; }
.grain { position: fixed; z-index: 4; inset: 0; opacity: .1; pointer-events: none; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E"); }
.topbar, .site-footer { position: relative; z-index: 5; display: flex; align-items: center; justify-content: space-between; padding: 25px 3.1vw; font: 500 10px/1 'DM Mono', monospace; letter-spacing: .12em; }
.wordmark { display: inline-flex; align-items: center; gap: 9px; font: 500 18px/1 'DM Mono', monospace; letter-spacing: -.08em; }
.wordmark i, .pub-logo + * i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--acid); box-shadow: 0 0 15px var(--acid); }
.menu-trigger, .quiet-link { padding: 0; border: 0; background: none; font: inherit; letter-spacing: inherit; }
.menu-trigger span { display: inline-block; margin-left: 10px; color: var(--acid); font-size: 15px; transition: transform .25s ease; }
.menu-trigger:hover span { transform: rotate(45deg); }
.menu-panel { position: fixed; z-index: 10; top: 14px; right: 14px; width: min(420px, calc(100vw - 28px)); padding: 28px; color: #0a0b0a; background: var(--acid); transform: translateY(-125%); transition: transform .45s cubic-bezier(.2,.9,.2,1); }
.menu-panel.is-open, .menu-panel.open { transform: translateY(0); }
.menu-panel p { margin: 0 0 32px; font: 500 10px 'DM Mono', monospace; letter-spacing: .12em; }
.menu-panel a { display: flex; gap: 25px; align-items: flex-start; padding: 18px 0; border-top: 1px solid rgba(0,0,0,.5); }
.menu-panel b { font: 500 11px 'DM Mono', monospace; }.menu-panel a span { font-size: 25px; font-weight: 700; }.menu-panel small { display: block; margin-top: 5px; font: 400 12px 'Noto Sans SC', sans-serif; }.menu-panel button { margin-top: 26px; padding: 0; border: 0; background: none; font: 500 10px 'DM Mono', monospace; letter-spacing: .1em; text-decoration: underline; }
.portal-main { position: relative; display: grid; min-height: calc(100svh - 113px); padding: clamp(48px, 8vh, 110px) 10vw 80px; }
.coordinates { position: absolute; top: 8vh; right: 3.1vw; display: grid; gap: 5px; text-align: right; color: #8d938e; font: 400 9px 'DM Mono', monospace; letter-spacing: .08em; }
.portal-copy { position: relative; z-index: 2; align-self: center; }
.eyebrow { margin: 0 0 24px; color: var(--acid); font: 500 10px 'DM Mono', monospace; letter-spacing: .14em; }
.portal h1 { margin: 0; max-width: 700px; font-size: clamp(58px, 9vw, 145px); font-weight: 500; line-height: .88; letter-spacing: -.08em; }.portal h1 em { font-family: Georgia, 'Noto Serif SC', serif; font-weight: 400; }
.lead { margin: 35px 0; color: #a4aaa4; font-size: clamp(14px, 1.35vw, 18px); line-height: 1.8; }
.portal-actions { display: flex; align-items: center; gap: 30px; }.primary-link { display: inline-flex; gap: 45px; align-items: center; padding: 15px 17px; color: #101208; background: var(--acid); font-size: 13px; font-weight: 700; }.primary-link span { font-size: 20px; transition: transform .2s ease; }.primary-link:hover span { transform: translateX(5px); }.quiet-link { color: #919791; font-size: 12px; text-decoration: underline; text-underline-offset: 4px; }
.door { position: absolute; right: 13vw; bottom: 12%; width: clamp(120px, 16vw, 240px); height: clamp(245px, 34vw, 500px); transform: perspective(600px) rotateY(-8deg); }.door-light { position: absolute; inset: 10% -30%; background: var(--acid); opacity: .2; filter: blur(65px); }.door-frame { position: absolute; inset: 0; border: 1px solid rgba(215,251,48,.8); box-shadow: inset 0 0 35px rgba(215,251,48,.2), 0 0 35px rgba(215,251,48,.13); }.door-frame span { position: absolute; inset: 8px; border: 1px solid rgba(215,251,48,.26); }.door p { position: absolute; right: -46px; bottom: -25px; margin: 0; color: var(--acid); font: 500 9px 'DM Mono', monospace; letter-spacing: .1em; writing-mode: vertical-rl; }
.whisper { position: absolute; bottom: 9%; left: 10vw; margin: 0; color: var(--acid); font-size: 13px; opacity: 0; transform: translateY(8px); transition: .3s ease; }.whisper.is-visible, .whisper.visible { opacity: 1; transform: none; }
.site-footer { color: #707670; border-top: 1px solid #202421; }.site-footer span:nth-child(2) { color: var(--acid); }

/* Public editorial page */
.public-page { --yellow: #e9ff58; --paper: #f4f2e9; color: #131313; background: var(--paper); }.public-page::selection { color: #111; background: var(--yellow); }.public-nav { display: flex; align-items: center; justify-content: space-between; padding: 18px 2.5vw; border-bottom: 1px solid #151515; }.pub-logo { font-size: 24px; font-weight: 900; letter-spacing: -.09em; }.pub-logo span { font-weight: 400; }.nav-status { display: flex; gap: 8px; align-items: center; font: 500 10px 'DM Mono', monospace; letter-spacing: .1em; }.nav-status i { width: 7px; height: 7px; border-radius: 50%; background: #55b34c; }.launch-small { padding: 9px 12px; color: var(--yellow); background: #171717; font-size: 12px; font-weight: 700; }.public-hero { position: relative; min-height: 630px; padding: 7vw 5vw 0; overflow: hidden; background: var(--yellow); }.issue, .section-label { margin: 0; font: 500 10px 'DM Mono', monospace; letter-spacing: .1em; }.public-hero h1 { margin: clamp(70px, 12vw, 180px) 0 0; font-size: clamp(48px, 8.8vw, 140px); font-weight: 900; line-height: .88; letter-spacing: -.1em; }.public-hero h1 span { color: var(--paper); text-shadow: 2px 2px 0 #151515; }.hero-bottom { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-top: clamp(50px, 9vw, 120px); }.hero-bottom p { max-width: 400px; margin: 0; font-size: 16px; line-height: 1.65; }.hero-bottom a { padding: 15px 18px; color: var(--paper); background: #171717; font-weight: 700; }.hero-bottom b { margin-left: 30px; color: var(--yellow); font-size: 18px; }.ticker { position: absolute; bottom: 0; left: 0; width: 100%; overflow: hidden; padding: 11px 0; color: var(--paper); background: #171717; white-space: nowrap; font: 500 11px 'DM Mono', monospace; letter-spacing: .07em; }.ticker div { width: max-content; animation: ticker 25s linear infinite; }
.manifesto { padding: clamp(75px, 12vw, 165px) 5vw; }.manifesto blockquote { max-width: 1060px; margin: clamp(60px, 9vw, 135px) auto; font-size: clamp(34px, 5.7vw, 86px); font-weight: 700; line-height: 1.05; letter-spacing: -.08em; text-align: center; }.manifesto-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 2px solid #171717; }.manifesto article { min-height: 235px; padding: 20px 25px 10px 0; border-right: 1px solid #171717; }.manifesto article + article { padding-left: 25px; }.manifesto article:last-child { border: 0; }.manifesto article b { font: 500 11px 'DM Mono', monospace; }.manifesto h2 { margin: 55px 0 12px; font-size: 22px; letter-spacing: -.05em; }.manifesto article p { max-width: 260px; margin: 0; font-size: 14px; line-height: 1.7; }
.how-it-works { padding: clamp(65px, 9vw, 130px) 5vw; color: var(--paper); background: #171717; }.keys { display: flex; flex-wrap: wrap; gap: clamp(13px, 2vw, 30px); align-items: center; margin: clamp(55px, 8vw, 115px) 0 35px; }.keys kbd { min-width: 76px; padding: 16px 18px; color: #171717; background: var(--yellow); border-radius: 4px; box-shadow: 4px 4px 0 #858e3a; font: 500 36px/1 'DM Mono', monospace; text-align: center; }.keys span { color: var(--yellow); font-size: 32px; }.keys strong { font-size: clamp(38px, 6vw, 88px); letter-spacing: -.09em; }.how-it-works > p { max-width: 450px; margin: 0 0 0 auto; color: #c4c4bb; line-height: 1.8; }.public-footer { display: flex; justify-content: space-between; gap: 15px; padding: 18px 2.5vw; font: 500 10px 'DM Mono', monospace; letter-spacing: .07em; }.public-footer a:last-child { text-decoration: underline; text-underline-offset: 3px; }
@keyframes ticker { to { transform: translateX(-33.333%); } }

@media (max-width: 700px) { .topbar, .site-footer { padding-inline: 20px; }.portal-main { min-height: calc(100svh - 105px); padding: 70px 28px 80px; }.coordinates { top: 28px; right: 20px; }.portal h1 { font-size: clamp(54px, 18vw, 92px); }.portal-actions { align-items: flex-start; flex-direction: column; gap: 20px; }.door { right: 12vw; bottom: 4%; width: 110px; height: 220px; opacity: .65; }.site-footer { font-size: 8px; }.site-footer span:nth-child(2) { display: none; }.public-nav { padding: 15px; }.nav-status { display: none; }.public-hero { min-height: 600px; padding: 38px 20px 0; }.public-hero h1 { margin-top: 100px; font-size: 15vw; }.hero-bottom { align-items: flex-start; flex-direction: column; margin-top: 65px; }.hero-bottom a { width: 100%; display: flex; justify-content: space-between; }.manifesto, .how-it-works { padding-inline: 20px; }.manifesto blockquote { margin: 70px 0; font-size: 10vw; text-align: left; }.manifesto-grid { display: block; }.manifesto article, .manifesto article + article { min-height: 0; padding: 22px 0 35px; border-right: 0; border-bottom: 1px solid #171717; }.manifesto h2 { margin-top: 35px; }.keys { gap: 12px; }.keys kbd { min-width: 57px; padding: 12px; font-size: 27px; }.keys strong { width: 100%; margin-top: 22px; }.how-it-works > p { margin: 0; }.public-footer { align-items: center; flex-direction: column; text-align: center; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }
