@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Inter:wght@400;500;600;700;800&display=swap');

:root { color: #171813; background: #f3f1e8; font-family: Inter, Arial, sans-serif; font-synthesis: none; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x: hidden; }
button, a { font: inherit; }
button { cursor: pointer; }
.topbar { height: 74px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 28px; background: #f3f1e8; border-bottom: 1px solid #171813; position: sticky; top: 0; z-index: 20; }
.brand { display: flex; align-items: center; gap: 12px; color: inherit; text-decoration: none; font-size: 12px; font-weight: 800; }
.brand-mark { display: grid; place-items: center; width: 36px; height: 36px; background: #e3483e; color: white; font-size: 13px; }
nav { display: flex; gap: 32px; }
nav a { color: inherit; text-decoration: none; font-size: 12px; font-weight: 700; text-transform: uppercase; }
.header-tools { display: flex; justify-content: flex-end; align-items: center; gap: 18px; }
.icon-btn { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid #171813; background: transparent; }
.icon-btn svg { width: 17px; }
.enter-link { display: flex; gap: 8px; align-items: center; color: inherit; text-decoration: none; font-size: 12px; font-weight: 800; text-transform: uppercase; }
.enter-link svg { width: 15px; }
.hero { min-height: calc(100vh - 74px); position: relative; display: flex; align-items: flex-end; overflow: hidden; background: #1673bc; }
.weather-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: opacity .7s ease, transform 8s ease; }
.image-clear { opacity: 1; }.image-rain { opacity: 0; }
.weather-rain .image-clear { opacity: 0; }.weather-rain .image-rain { opacity: 1; }
.hero:hover .weather-image { transform: scale(1.025); }
.hero-scrim { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5,18,25,.74) 0%, rgba(5,18,25,.28) 42%, transparent 70%); }
.hero-copy { position: relative; z-index: 2; width: min(720px, 70%); color: white; padding: 0 0 136px 5vw; }
.eyebrow,.section-index { font: 500 11px DM Mono, monospace; text-transform: uppercase; }
h1 { font-size: clamp(48px, 6.6vw, 104px); line-height: .91; letter-spacing: 0; margin: 18px 0 26px; font-weight: 800; }
h1 em { color: #f7d54a; font-style: normal; }
.weather-rain h1 em { color: #ff675d; }
.hero-lede { max-width: 590px; font-size: 17px; line-height: 1.55; }
.hero-actions { display: flex; gap: 12px; margin-top: 30px; }
.primary-action,.secondary-action { min-height: 52px; padding: 0 22px; border: 1px solid white; display: inline-flex; gap: 10px; align-items: center; font-size: 12px; font-weight: 800; text-transform: uppercase; }
.primary-action { background: #f7d54a; color: #171813; border-color: #f7d54a; }
.secondary-action { background: transparent; color: white; }
.primary-action svg,.secondary-action svg { width: 17px; }
.live-strip { position: absolute; z-index: 3; bottom: 0; left: 0; right: 0; min-height: 92px; display: grid; grid-template-columns: repeat(5,1fr); background: rgba(243,241,232,.94); color: #171813; border-top: 1px solid #171813; backdrop-filter: blur(10px); }
.live-strip div { padding: 20px 24px; border-right: 1px solid #171813; }
.live-strip span,.agent-detail span { display: block; font: 500 10px DM Mono, monospace; margin-bottom: 8px; }
.live-strip strong { font: 500 20px DM Mono, monospace; }
.manifesto { display: grid; grid-template-columns: 1fr 3fr; padding: 110px 5vw; background: #f3f1e8; border-bottom: 1px solid #171813; }
.manifesto h2,.section-head h2,.console-copy h2,.math-title h2 { font-size: clamp(42px, 5.6vw, 82px); line-height: .98; margin: 0; letter-spacing: 0; }
.manifesto p:not(.section-index) { max-width: 730px; font-size: 20px; line-height: 1.55; }
.agent-section { background: #171813; color: #f3f1e8; padding: 100px 5vw; }
.section-head { display: grid; grid-template-columns: 2fr 1fr; gap: 80px; align-items: end; margin-bottom: 64px; }
.section-head p:last-child { line-height: 1.6; }
.agent-grid { display: grid; grid-template-columns: repeat(5,1fr); border: 1px solid #6b6d65; }
.agent-card { min-height: 310px; padding: 22px; background: transparent; color: inherit; border: 0; border-right: 1px solid #6b6d65; text-align: left; display: flex; flex-direction: column; transition: background .25s,color .25s; }
.agent-card:last-child { border-right: 0; }
.agent-card:hover,.agent-card.selected { background: var(--agent-color); color: white; }
.agent-card svg { width: 42px; height: 42px; margin: 28px 0 auto; stroke-width: 1.5; }
.agent-number { font: 400 11px DM Mono, monospace; }
.agent-name { font-size: 26px; font-weight: 700; }
.agent-role { font-size: 12px; line-height: 1.5; min-height: 54px; margin: 9px 0 18px; }
.agent-card strong { font: 500 13px DM Mono, monospace; }
.agent-detail { display: grid; grid-template-columns: 1fr 2fr auto; align-items: center; gap: 30px; padding: 28px 0; border-bottom: 1px solid #6b6d65; }
.agent-detail strong { font-size: 22px; }.agent-detail p { margin: 0; line-height: 1.5; }
.status-pulse { font: 500 10px DM Mono,monospace; display:flex; align-items:center; gap:9px; }
.status-pulse span { width: 9px; height: 9px; border-radius: 50%; background:#47c987; margin:0; box-shadow:0 0 15px currentColor; }
.console-section { display:grid; grid-template-columns: 1fr 1.3fr; min-height: 680px; background:#e3483e; border-bottom:1px solid #171813; }
.console-copy { padding:100px 5vw; }.console-copy p:not(.section-index){max-width:480px;line-height:1.6;}
.primary-action.dark { margin-top:30px; background:#171813; color:white; border-color:#171813; }
.event-terminal { margin:44px; background:#11130f; color:#eeefe8; border:1px solid #11130f; padding:28px; display:flex; flex-direction:column; }
.terminal-head { display:flex; justify-content:space-between; font:500 10px DM Mono,monospace; padding-bottom:24px;border-bottom:1px solid #565951; }
.event-list { margin-top:12px; }.event-list>div { display:grid;grid-template-columns:120px 110px 1fr;gap:12px;padding:13px 0;border-bottom:1px solid #33362f;font:400 11px DM Mono,monospace; }
.event-list b {color:#ddd}.event-list .green{color:#55d494}.event-list .yellow{color:#f7d54a}.event-list .blue{color:#5aa7e8}.new-event{animation:flash .7s ease}
@keyframes flash{from{background:#2d9e64}to{background:transparent}}
.terminal-bars { height:190px;margin-top:auto;display:flex;gap:10px;align-items:end;border-bottom:1px solid #7d8077; }
.terminal-bars span{height:var(--h);flex:1;background:#f7d54a;transition:height .3s;}.terminal-bars span:nth-child(3n){background:#e3483e}.terminal-bars span:nth-child(4n){background:#55d494}
.math-section { display:grid;grid-template-columns:1fr 1.4fr;gap:80px;padding:110px 5vw;background:#f7d54a; }
.formula-panel { background:#f3f1e8;border:1px solid #171813;padding:32px;align-self:start; }
.formula-tabs{display:flex;gap:4px;border-bottom:1px solid #171813;padding-bottom:20px}.formula-tabs button{border:0;background:transparent;padding:8px 14px}.formula-tabs .active{background:#171813;color:white}
.formula { font:500 clamp(24px,3vw,48px) DM Mono,monospace;padding:54px 0 34px; }
.formula-values{display:flex;gap:10px;flex-wrap:wrap;font:400 12px DM Mono,monospace}.formula-values span,.formula-values strong{border:1px solid #171813;padding:10px}.formula-values strong{background:#e3483e;color:white}
.formula-panel p{margin-top:32px;line-height:1.6;max-width:620px}
footer { min-height:120px;background:#171813;color:#f3f1e8;display:flex;justify-content:space-between;align-items:center;padding:0 5vw;font:400 11px DM Mono,monospace;text-transform:uppercase; }
@media(max-width:900px){.topbar{grid-template-columns:1fr auto}.topbar nav{display:none}.hero-copy{width:90%;padding-left:24px}.live-strip{grid-template-columns:repeat(2,1fr);position:relative}.live-strip div:last-child{grid-column:span 2}.hero{min-height:900px;align-items:center}.manifesto,.section-head,.console-section,.math-section{grid-template-columns:1fr}.manifesto{gap:50px}.agent-grid{grid-template-columns:1fr 1fr}.agent-card{border-bottom:1px solid #6b6d65}.agent-detail{grid-template-columns:1fr}.event-terminal{margin:24px;min-height:540px}.math-section{gap:48px}.header-tools .enter-link{display:none}}
@media(max-width:560px){.topbar{height:64px;padding:0 16px}.brand span:last-child{display:none}.hero{min-height:820px}.hero-copy{padding:70px 20px 50px;align-self:flex-start}.hero-actions{flex-direction:column;align-items:stretch}.hero-actions button{justify-content:center}.live-strip{position:absolute}.live-strip div{padding:14px}.live-strip strong{font-size:15px}.manifesto,.agent-section,.console-copy,.math-section{padding:70px 20px}.agent-grid{grid-template-columns:1fr}.agent-card{min-height:230px;border-right:0}.agent-card svg{margin:20px 0 30px}.event-terminal{margin:0 20px 60px;padding:18px}.event-list>div{grid-template-columns:88px 80px 1fr;font-size:9px}.terminal-bars{height:130px}.formula-panel{padding:20px}footer{flex-direction:column;align-items:flex-start;justify-content:center;gap:12px}}