/* D82LABS — PUBLIC FRONTIER v3 · foundation layer
   Public scope: public objects only.

:root{
  --paper:#f5f2ec;            /* warm white — evidence surfaces */
  --paper-dim:#e9e5dc;
  --graphite:#141416;
  --metal:#8f9298;            /* metallic neutral */
  --metal-dim:#5b5e64;
  --line-metal:rgba(143,146,152,.25);
  --signal:#e10600;           /* D82 red — signal, not wallpaper */
  --signal-soft:rgba(225,6,0,.10);
  --font-display:"Space Grotesk",system-ui,sans-serif;
  --font-body:"Inter",system-ui,-apple-system,sans-serif;
  --font-mono:ui-monospace,"SF Mono","Cascadia Mono",Menlo,Consolas,monospace;
  --ease-out:cubic-bezier(.16,1,.3,1);
  --dur-immediate:140ms;
  --dur-structural:480ms;
  --dur-cinematic:900ms;
  --rail:min(1180px,100% - clamp(40px,8vw,96px));
}

/* ————— MOTION CLASSES —————
   Immediate: controls/nav (140ms) · Structural: sections/diagrams (480ms) · Cinematic: hero/archive (900ms) */

.reveal{opacity:0;transform:translateY(14px);transition:opacity var(--dur-structural) var(--ease-out),transform var(--dur-structural) var(--ease-out);transition-delay:var(--reveal-delay,0ms)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
  .reveal{opacity:1;transform:none}
}

/* ————— RECEIPTS ————— */
.receipt{display:inline-flex;align-items:center;gap:6px;font:500 11px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--metal);border:1px solid var(--line-metal);border-radius:2px;padding:5px 8px}
.receipt b{color:var(--text,#f4f4f2)}
.receipt::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--signal)}
.receipt.live::before{background:#2fbf71}

/* ————— ACTIVE NOW ————— */
.active-rail{display:grid;gap:1px;background:var(--line-metal,#212128);border:1px solid var(--line-metal,#212128);border-radius:4px;overflow:hidden}
.active-item{display:grid;grid-template-columns:110px 1fr auto;gap:16px;align-items:center;background:var(--bg-raise,#0b0b0e);padding:16px 20px;text-decoration:none;color:inherit;transition:background var(--dur-immediate) var(--ease-out)}
.active-item:hover{background:var(--panel,#101014)}
.active-item .a-date{font:500 11px/1.4 var(--font-mono);letter-spacing:.08em;color:var(--metal)}
.active-item .a-kind{font:600 10px/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--signal)}
.active-item .a-title{font:600 16px/1.35 var(--font-display);color:var(--text,#f4f4f2)}
.active-item .a-sub{font:400 13px/1.5 var(--font-body);color:var(--muted,#a2a5ab);margin-top:2px}
.active-item .a-go{color:var(--metal);transition:transform var(--dur-immediate) var(--ease-out),color var(--dur-immediate)}
.active-item:hover .a-go{transform:translateX(4px);color:var(--signal)}

/* ————— SIGNAL FEED ————— */
.signal-feed{list-style:none;margin:0;padding:0;border-left:1px solid var(--line-metal,#212128)}
.signal-feed li{position:relative;padding:0 0 22px 22px}
.signal-feed li::before{content:"";position:absolute;left:-4px;top:5px;width:7px;height:7px;border-radius:50%;background:var(--graphite);border:1px solid var(--metal)}
.signal-feed li.hot::before{background:var(--signal);border-color:var(--signal)}
.signal-feed .s-date{font:500 11px/1 var(--font-mono);letter-spacing:.08em;color:var(--metal)}
.signal-feed .s-text{font:400 14px/1.55 var(--font-body);color:var(--text,#f4f4f2);margin-top:4px}
.signal-feed .s-text a{color:inherit;text-decoration:underline;text-decoration-color:var(--line-metal);text-underline-offset:3px}
.signal-feed .s-text a:hover{text-decoration-color:var(--signal)}

/* ————— FRONTIER QUESTIONS ————— */
.fq{border:1px solid var(--line-metal,#212128);border-radius:4px;padding:22px;display:grid;gap:12px;background:linear-gradient(180deg,var(--bg-raise,#0b0b0e),transparent);transition:border-color var(--dur-immediate) var(--ease-out)}
.fq:hover{border-color:var(--metal-dim)}
.fq-state{display:inline-flex;gap:6px;align-items:center;font:600 10px/1 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;padding:5px 8px;border-radius:2px;width:fit-content}
.fq-state.known{color:#2fbf71;border:1px solid rgba(47,191,113,.4)}
.fq-state.tested{color:var(--metal);border:1px solid var(--line-metal)}
.fq-state.open{color:var(--signal);border:1px solid rgba(225,6,0,.4)}
.fq h3{margin:0;font:600 19px/1.3 var(--font-display);color:var(--text,#f4f4f2)}
.fq p{margin:0;font:400 14px/1.6 var(--font-body);color:var(--muted,#a2a5ab)}
.fq .fq-ev{font:400 12px/1.5 var(--font-mono);color:var(--metal)}

/* ————— CHAIN (Continue the Chain) ————— */
.chain{display:flex;flex-wrap:wrap;gap:10px}
.chain a{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line-metal,#212128);border-radius:999px;padding:9px 16px;font:500 13px/1 var(--font-body);color:var(--text,#f4f4f2);text-decoration:none;transition:border-color var(--dur-immediate) var(--ease-out),transform var(--dur-immediate) var(--ease-out)}
.chain a:hover{border-color:var(--signal);transform:translateY(-1px)}
.chain a::after{content:"→";color:var(--signal)}
.chain .chain-label{width:100%;font:600 10px/1 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--metal)}

/* ————— AGENT CARD ————— */
.agent{border:1px solid var(--line-metal,#212128);border-radius:4px;padding:24px;display:grid;gap:14px;background:var(--bg-raise,#0b0b0e)}
.agent-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.agent-purpose{font:400 14px/1.6 var(--font-body);color:var(--muted,#a2a5ab)}
.agent-spec{display:grid;grid-template-columns:92px 1fr;gap:6px 14px;font:400 13px/1.5 var(--font-body)}
.agent-spec dt{font:600 10px/1.8 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--metal)}
.agent-spec dd{margin:0;color:var(--text,#f4f4f2)}

/* ————— SEARCH SHELL ————— */
.search-veil{position:fixed;inset:0;z-index:80;background:rgba(5,5,6,.72);backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:opacity var(--dur-immediate) var(--ease-out)}
.search-veil.open{opacity:1;pointer-events:auto}
.search-panel{position:fixed;z-index:81;top:12vh;left:50%;transform:translateX(-50%) translateY(-8px);width:min(640px,calc(100vw - 32px));background:var(--panel,#101014);border:1px solid var(--line-metal,#212128);border-radius:6px;overflow:hidden;opacity:0;pointer-events:none;transition:opacity var(--dur-immediate) var(--ease-out),transform var(--dur-immediate) var(--ease-out)}
.search-panel.open{opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.search-bar{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line-soft,#191920)}
.search-bar svg{color:var(--metal);flex:none}
.search-bar input{flex:1;background:none;border:0;outline:0;color:var(--text,#f4f4f2);font:400 15px/1.4 var(--font-body)}
.search-bar input::placeholder{color:var(--metal-dim)}
.search-kbd{font:500 10px/1 var(--font-mono);color:var(--metal);border:1px solid var(--line-metal);border-radius:3px;padding:3px 6px}
.search-results{max-height:52vh;overflow:auto;padding:8px}
.search-group{font:600 10px/1 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--metal);padding:12px 10px 6px}
.search-hit{display:flex;align-items:baseline;gap:10px;padding:9px 10px;border-radius:3px;text-decoration:none;color:var(--text,#f4f4f2);transition:background var(--dur-immediate)}
.search-hit:hover,.search-hit.active{background:var(--signal-soft)}
.search-hit .hit-title{font:500 14px/1.4 var(--font-body)}
.search-hit .hit-kind{margin-left:auto;font:500 10px/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--metal);flex:none}
.search-empty{padding:26px 16px;text-align:center;color:var(--metal);font:400 13px/1.5 var(--font-body)}
.search-open-btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line-metal,#212128);border-radius:3px;background:none;color:var(--muted,#a2a5ab);font:500 12px/1 var(--font-body);padding:8px 12px;cursor:pointer;transition:border-color var(--dur-immediate),color var(--dur-immediate)}
.search-open-btn:hover{border-color:var(--metal);color:var(--text,#f4f4f2)}

/* ————— ENGAGEMENT ————— */
.engage{border:1px solid var(--line-metal,#212128);border-radius:4px;padding:clamp(24px,4vw,44px);display:grid;gap:18px;background:
  linear-gradient(120deg,var(--bg-raise,#0b0b0e) 60%,rgba(225,6,0,.05))}
.engage h2{margin:0;font:700 clamp(24px,3.2vw,36px)/1.15 var(--font-display);color:var(--text,#f4f4f2)}
.engage-row{display:flex;flex-wrap:wrap;gap:10px}
.engage-chip{font:500 12px/1 var(--font-body);color:var(--text,#f4f4f2);border:1px solid var(--line-metal);border-radius:999px;padding:8px 14px}

/* ————— HERO v3 ————— */
.hero-kicker-v3{display:flex;align-items:center;gap:10px;font:600 11px/1 var(--font-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--metal)}
.hero-kicker-v3::before{content:"";width:26px;height:1px;background:var(--signal)}
.hero-title-v3{font:700 clamp(34px,5.4vw,64px)/1.06 var(--font-display);letter-spacing:-.015em;color:var(--text,#f4f4f2);margin:18px 0 0;max-width:20ch}
.hero-title-v3 .r{color:var(--signal)}
.hero-sub-v3{font:400 clamp(15px,1.6vw,18px)/1.6 var(--font-body);color:var(--muted,#a2a5ab);max-width:56ch;margin:18px 0 0}
.hero-founder{margin-top:26px;font:500 12px/1.6 var(--font-mono);letter-spacing:.06em;color:var(--metal)}

/* mobile */
@media (max-width:760px){
  .active-item{grid-template-columns:1fr auto;grid-template-rows:auto auto}
  .active-item .a-date{grid-column:1}
  .agent-spec{grid-template-columns:1fr;gap:2px}
  .agent-spec dt{margin-top:8px}
}
