/* ============================================================
   FRONTIER // DECODED — v119 "Observatory"
   Button hierarchy · motion budget · the Observatory home ·
   the Frontier Constellations sky · FDExplain learning visuals.
   Loaded on every page by site.js (after chrome.css).
   ============================================================ */
:root{--fd-live:var(--cy,#25d0ff);--fd-warn:var(--amb,#ffb000);--fd-field:var(--bg,#050807);--fd-panel:var(--bg2,#0a0f0d);--fd-line:var(--line2,#1f3a30)}

/* ---- one button hierarchy: primary / ghost / text ---- */
.btn.primary{background:var(--grn,#39ff14);color:#042;border-color:var(--grn,#39ff14);font-weight:800}
.btn.primary:hover{filter:brightness(1.08)}
.btn.text{background:transparent;border-color:transparent;color:var(--grn,#39ff14);padding-left:4px;padding-right:4px}
.btn.text:hover{text-decoration:underline}
.chip{display:inline-block;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--fd-line);border-radius:3px;padding:2px 7px;color:var(--dim);vertical-align:middle}
.chip.live{color:var(--fd-live);border-color:rgba(37,208,255,.45)}
.chip.live::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--fd-live);margin-right:5px;box-shadow:0 0 8px var(--fd-live)}

/* ---- motion budget: one switch for the whole site ---- */
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation-duration:.001s!important;animation-iteration-count:1!important;transition-duration:.001s!important;scroll-behavior:auto!important}
 .ticker .tk-track{animation:none!important}
}

/* ================= the Observatory (home) ================= */
#observatory{position:relative;background:var(--fd-field);border-bottom:1px solid var(--line)}
#observatory .ob-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:28px;align-items:start;padding:34px 0 18px}
@media(max-width:980px){#observatory .ob-grid{grid-template-columns:minmax(0,1fr);gap:18px}}
.ob-copy .kicker{display:inline-block}
.ob-h1{font-family:var(--disp,'Saira Condensed',var(--sans));font-weight:800;font-size:clamp(36px,4.9vw,68px);line-height:.98;letter-spacing:-.01em;color:var(--wht);margin:12px 0 14px;text-transform:uppercase}
.ob-h1 .ac{color:var(--grn)}
.ob-lede{font-family:var(--sans);font-size:17px;line-height:1.65;color:var(--txt);max-width:58ch;margin:0 0 16px}
.ob-ep{border:1px solid var(--fd-line);background:var(--fd-panel);border-radius:10px;padding:14px 16px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:center;margin:0 0 14px}
.ob-ep .orb{width:54px;height:54px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#c9f7e3,#39ffa0 45%,#0b5a3b 100%);box-shadow:0 0 22px rgba(57,255,160,.4)}
.ob-ep .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.ob-ep .t{font-family:var(--sans);font-size:16px;font-weight:600;color:var(--wht);margin:3px 0 2px;line-height:1.3}
.ob-ep .m{font-family:var(--mono);font-size:11px;color:var(--dim)}
.ob-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 18px}
.ob-proof{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
@media(max-width:560px){.ob-proof{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ob-proof div{border-left:2px solid var(--fd-line);padding:2px 0 2px 10px}
.ob-proof .n{font-family:var(--mono);font-size:22px;font-weight:800;color:var(--grn);line-height:1.1}
.ob-proof .l{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);margin-top:3px}
/* the sky */
#obSkyWrap{position:relative;width:100%;max-width:100%;aspect-ratio:1000/680;min-height:0;border:1px solid var(--fd-line);border-radius:14px;overflow:hidden;background:radial-gradient(ellipse at 56% 50%,#0b1413 0%,#050807 62%)}
#obGalaxy{position:absolute;inset:0;width:100%;height:100%;display:block}
#obSky{position:absolute;inset:0;width:100%;height:100%;display:block;transition:none}
#obSky .sk-bg circle{fill:#cfe3dc;opacity:.35}
#obSky .sk-c{cursor:pointer;outline:none}
#obSky .sk-hit{fill:transparent;stroke:transparent;stroke-width:1}
#obSky .sk-c:focus-visible .sk-hit{stroke:var(--grn);stroke-dasharray:4 4}
#obSky .sk-lines line{stroke:#5f8f7c;stroke-width:1;opacity:.55;transition:stroke .2s,opacity .2s}
#obSky .sk-star .halo{fill:var(--grn);opacity:0;transition:opacity .25s}
#obSky .sk-star .core{fill:#eafff0;filter:drop-shadow(0 0 3px rgba(234,255,240,.8))}
#obSky .sk-sl{font-family:var(--mono);font-size:11px;fill:#cfe3dc;opacity:0;transition:opacity .2s;pointer-events:none}
#obSky .sk-name{font-family:var(--mono);font-size:12px;letter-spacing:.18em;fill:#9fb8ab;transition:fill .2s}
#obSky .sk-name .lv{fill:var(--fd-live);letter-spacing:.1em}
#obSky .sk-c.hov .sk-lines line,#obSky .sk-c.on .sk-lines line{stroke:var(--grn);opacity:1}
#obSky .sk-c.hov .sk-star .halo,#obSky .sk-c.on .sk-star .halo{opacity:.22}
#obSky .sk-c.hov .sk-sl,#obSky .sk-c.on .sk-sl{opacity:1}
#obSky .sk-c.hov .sk-name,#obSky .sk-c.on .sk-name{fill:var(--grn)}
#obSky .sk-c.dim{opacity:.18}
#obSky.focused .sk-c.on .sk-star{cursor:pointer}
#obSky.focused .sk-c.on .sk-star:hover .core{fill:var(--grn)}
#obHint{position:absolute;left:12px;top:10px;font-family:var(--mono);font-size:10.5px;color:var(--dim);letter-spacing:.06em;pointer-events:none;max-width:70%}
#obPanel{position:absolute;right:12px;top:12px;width:min(300px,calc(100% - 24px));background:rgba(5,8,7,.88);backdrop-filter:blur(6px);border:1px solid var(--fd-line);border-radius:10px;padding:14px;display:none;z-index:2}
#obPanel.on{display:block}
#obPanel .obp-k{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
#obPanel h3{font-family:var(--sans);font-size:20px;color:var(--wht);margin:4px 0 4px}
#obPanel p{font-family:var(--sans);font-size:13px;color:var(--txt);margin:0 0 8px;line-height:1.5}
#obPanel ul{list-style:none;margin:0 0 10px;padding:0;columns:2;column-gap:12px}
#obPanel li a{font-family:var(--mono);font-size:11.5px;color:var(--cy);text-decoration:none;display:block;padding:2px 0}
#obPanel li a:hover{color:var(--grn)}
#obPanel .obp-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
#obPanel .btn{padding:8px 12px;font-size:11px}
@media(max-width:760px){#obPanel{position:static;width:auto;margin-top:10px}#obSkyWrap{min-height:0}}
/* list twin */
.ob-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.obl{border:1px solid var(--fd-line);background:var(--fd-panel);border-radius:10px;padding:14px 16px;transition:border-color .2s}
.obl.on,.obl:hover{border-color:var(--grn)}
.obl-h{display:flex;align-items:center;gap:8px}
.obl-n{font-family:var(--sans);font-size:17px;font-weight:700;color:var(--wht);text-decoration:none}
.obl-n:hover{color:var(--grn)}
.obl-sky{margin-left:auto;background:transparent;border:1px solid var(--fd-line);color:var(--dim);font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;padding:4px 8px;border-radius:4px;cursor:pointer}
.obl-sky:hover{color:var(--grn);border-color:var(--grn)}
.obl p{font-family:var(--sans);font-size:13.5px;color:var(--txt);margin:6px 0 8px;line-height:1.5}
.obl-l{display:flex;flex-wrap:wrap;gap:4px 10px}
.obl-l a{font-family:var(--mono);font-size:11px;color:var(--cy);text-decoration:none}
.obl-l a:hover{color:var(--grn);text-decoration:underline}
/* briefing */
.ob-brief{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media(max-width:860px){.ob-brief{grid-template-columns:minmax(0,1fr)}}
.obb{border:1px solid var(--fd-line);background:var(--fd-panel);border-radius:10px;padding:14px 16px;display:flex;flex-direction:column;gap:6px;min-height:150px}
.obb .k{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.obb .t{font-family:var(--sans);font-size:16px;font-weight:600;color:var(--wht);line-height:1.35}
.obb .t a{color:inherit;text-decoration:none}.obb .t a:hover{color:var(--grn)}
.obb .s{font-family:var(--sans);font-size:13.5px;color:var(--txt);line-height:1.5;flex:1}
.obb .f{font-family:var(--mono);font-size:10.5px;color:var(--dim)}
.obb .f a{color:var(--cy);text-decoration:none}
/* live observatory strip */
.ob-live{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media(max-width:760px){.ob-live{grid-template-columns:minmax(0,1fr)}}
.obv{border:1px solid var(--fd-line);background:var(--fd-panel);border-radius:10px;padding:14px 16px;text-decoration:none;display:block}
.obv:hover{border-color:var(--grn)}
.obv .k{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);display:flex;justify-content:space-between;align-items:center}
.obv .v{font-family:var(--mono);font-size:30px;font-weight:800;color:var(--wht);margin:6px 0 2px;line-height:1.1}
.obv .v.amber{color:var(--fd-warn)}
.obv .s{font-family:var(--mono);font-size:11px;color:var(--dim)}
/* how it works */
.ob-how{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;counter-reset:how}
@media(max-width:860px){.ob-how{grid-template-columns:repeat(2,minmax(0,1fr))}}
.obh{border-top:2px solid var(--fd-line);padding:12px 0 0}
.obh b{display:block;font-family:var(--sans);font-size:16px;color:var(--wht);margin-bottom:4px}
.obh b::before{counter-increment:how;content:counter(how,decimal-leading-zero) " ";font-family:var(--mono);color:var(--grn);font-size:12px;letter-spacing:.1em;margin-right:6px}
.obh p{font-family:var(--sans);font-size:13.5px;color:var(--txt);margin:0;line-height:1.5}
.ob-divider{display:flex;justify-content:center;padding:18px 0 0}
.ob-divider a{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);text-decoration:none;border:1px solid var(--fd-line);border-radius:20px;padding:8px 16px}
.ob-divider a:hover{color:var(--grn);border-color:var(--grn)}
.ob-sec{padding:26px 0 8px}
.ob-sec .shead{margin-bottom:12px}
#observatory .wrap+.wrap{border-top:1px dashed var(--line)}
#observatory .fdx-box{margin:0}

/* ================= FDExplain ================= */
.fdx-box{border:1px solid var(--fd-line);background:var(--fd-panel);border-radius:12px;padding:16px 18px;margin:18px 0}
.fdx-h{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
.fdx-k{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--grn)}
.fdx-box h3{font-family:var(--sans);font-size:22px;color:var(--wht);margin:4px 0 0;font-weight:700}
.fdx-ctl{display:flex;gap:4px;border:1px solid var(--fd-line);border-radius:6px;overflow:hidden}
.fdx-btn{background:transparent;border:0;color:var(--dim);font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;padding:7px 11px;cursor:pointer}
.fdx-btn.on{background:var(--grn);color:#042;font-weight:800}
.fdx-cap{font-family:var(--sans);font-size:13.5px;color:var(--txt);line-height:1.55;margin:8px 0 10px;max-width:80ch}
.fdx-svg{width:100%;height:auto;display:block;font-family:var(--mono)}
.fdx-ground{stroke:var(--fd-line);stroke-width:1.5}
.fdx-grid{stroke:var(--line);stroke-width:1;stroke-dasharray:3 5}
.fdx-ax{fill:var(--dim);font-size:10px}
.fdx-lab{fill:var(--wht);font-size:11.5px}
.fdx-sub{fill:var(--dim);font-size:10px}
.fdx-sub.est{fill:var(--fd-warn)}
.fdx-rocket{fill:rgba(234,255,240,.08);stroke:#9fb8ab;stroke-width:1.2;transition:fill .2s,stroke .2s}
.fdx-fin{fill:rgba(159,184,171,.5)}
.fdx-item:hover .fdx-rocket,.fdx-item:focus .fdx-rocket{fill:rgba(57,255,20,.18);stroke:var(--grn)}
.fdx-item{outline:none;cursor:default}
.fdx-item:focus .fdx-lab,.fdx-item:hover .fdx-lab{fill:var(--grn)}
.fdx-person circle,.fdx-person line,.fdx-person path{stroke:var(--fd-live);fill:none;stroke-width:1.6;stroke-linecap:round}.fdx-person circle{fill:var(--fd-live)}
.fdx-bot circle,.fdx-bot path,.fdx-bot line{fill:rgba(234,255,240,.08);stroke:#cfe3dc;stroke-width:1.6;stroke-linecap:round}
.fdx-item:hover .fdx-bot *,.fdx-item:focus .fdx-bot *{stroke:var(--grn)}
.fdx-ring{fill:none;stroke:#5f8f7c;stroke-width:1;stroke-dasharray:2 4}
.fdx-item:hover .fdx-ring,.fdx-item:focus .fdx-ring{stroke:var(--grn);stroke-dasharray:none}
.fdx-dot{fill:var(--grn)}
.fdx-earth{fill:#0e2a1f;stroke:var(--fd-live);stroke-width:1.5}
.fdx-node{fill:rgba(234,255,240,.06);stroke:#9fb8ab;stroke-width:1.2}
.fdx-node-big{stroke:var(--grn)}
.fdx-item:hover .fdx-node,.fdx-item:focus .fdx-node{stroke:var(--grn);fill:rgba(57,255,20,.15)}
.fdx-arrow{stroke:var(--fd-line);stroke-width:1.5;fill:none;marker-end:none}
.fdx-bar{fill:rgba(57,255,20,.35);stroke:var(--grn);stroke-width:1}
.fdx-bar.warn{fill:rgba(255,176,0,.3);stroke:var(--fd-warn)}
.fdx-item:hover .fdx-bar,.fdx-item:focus .fdx-bar{fill:rgba(57,255,20,.6)}
.fdx-live line{stroke:var(--fd-warn);stroke-width:2;stroke-dasharray:4 3}
.fdx-lab.lv{fill:var(--fd-warn)}
.fdx-data table{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:12px}
.fdx-data th{text-align:left;color:var(--dim);font-weight:400;letter-spacing:.08em;text-transform:uppercase;font-size:10px;padding:6px 8px;border-bottom:1px solid var(--fd-line)}
.fdx-data td{padding:6px 8px;border-bottom:1px solid var(--line);color:var(--txt)}
.fdx-src{font-family:var(--mono);font-size:10.5px;color:var(--dim);margin-top:10px;line-height:1.7}
.fdx-src a{color:var(--cy);text-decoration:none}.fdx-src a:hover{color:var(--grn)}
.fdx-tip{position:fixed;z-index:9999;background:rgba(5,8,7,.96);border:1px solid var(--grn);border-radius:8px;padding:8px 11px;font-family:var(--sans);font-size:13px;line-height:1.5;color:var(--txt);max-width:280px;pointer-events:none;display:none;box-shadow:0 10px 30px rgba(0,0,0,.6)}
.fdx-tip b{color:var(--wht)}.fdx-tip i{color:var(--dim);font-style:normal;font-size:11px}

/* ---- the 13 skins live in the footer now (the header keeps one brand field) ---- */
.foot .themepick{margin-right:0;vertical-align:middle}
.foot .themepick .tp-menu{top:auto;bottom:calc(100% + 12px);left:auto;right:-6px;transform:translateY(6px)}
.foot .themepick:hover .tp-menu,.foot .themepick:focus-within .tp-menu,.foot .themepick.open .tp-menu{transform:translateY(0)}
.foot .themepick::after{top:auto;bottom:100%}
.foot .skins{font-family:var(--mono);font-size:11px;color:var(--dim);letter-spacing:.08em}

/* zoomed-in sky: labels are drawn in user units, so they shrink to stay readable */
#obSky.focused .sk-sl{font-size:6.5px}
#obSky.focused .sk-name{font-size:7px;letter-spacing:.14em}
#obSky.focused .sk-lines line{stroke-width:.6}
#obSky.focused .sk-star .core{filter:none}

/* ---- v120 visual wall additions ---- */
.fdx-dot.warn{fill:var(--fd-warn)}
.fdx-sa{stroke:var(--fd-field);stroke-width:1}.fdx-sa.act{fill:var(--grn)}.fdx-sa.ret{fill:#6b7f78}.fdx-sa.dev{fill:var(--fd-warn)}
.fdx-item:hover .fdx-sa,.fdx-item:focus .fdx-sa{stroke:var(--wht);stroke-width:2}
.fdx-pt .pt{stroke:rgba(234,255,240,.12);stroke-width:1;transition:stroke .15s}
.fdx-pt .pt.c0{fill:rgba(159,184,171,.12)}.fdx-pt .pt.c1{fill:rgba(255,107,107,.28)}.fdx-pt .pt.c2{fill:rgba(255,176,0,.28)}.fdx-pt .pt.c3{fill:rgba(57,255,20,.16)}.fdx-pt .pt.c4{fill:rgba(37,208,255,.22)}.fdx-pt .pt.c5{fill:rgba(143,192,255,.3)}.fdx-pt .pt.c6{fill:rgba(234,255,240,.22)}.fdx-pt .pt.c7{fill:rgba(255,99,196,.26)}.fdx-pt .pt.c8{fill:rgba(180,120,255,.28)}.fdx-pt .pt.c9{fill:rgba(255,200,120,.22)}.fdx-pt .pt.c10{fill:rgba(255,140,80,.22)}
.fdx-pt .fdx-item:hover .pt,.fdx-pt .fdx-item:focus .pt{stroke:var(--grn);stroke-width:2}
.fdx-pt .pt-sym{font-size:17px;font-weight:800}
.fdx.compact .fdx-cap{display:none}.fdx.compact.fdx-box{margin:0;padding:12px 14px}.fdx.compact h3{font-size:16px}
/* the wall */
.wall{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px}
.wall>.w6{grid-column:span 6}.wall>.w4{grid-column:span 4}.wall>.w12{grid-column:span 12}.wall>.w8{grid-column:span 8}
@media(max-width:980px){.wall>.w6,.wall>.w4,.wall>.w8{grid-column:span 12}}
.wall .fdx-box{height:100%;box-sizing:border-box}
/* telemetry bar */
.tele{display:flex;flex-wrap:wrap;gap:0;border:1px solid var(--fd-line);border-radius:10px;overflow:hidden;background:var(--fd-panel);margin:16px 0 12px}
.tele a{flex:1 1 0;min-width:118px;padding:10px 12px;text-decoration:none;border-right:1px solid var(--line);display:block}
.tele a:last-child{border-right:0}.tele a:hover{background:rgba(57,255,20,.06)}
.tele .k{font-family:var(--mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);display:flex;justify-content:space-between;gap:6px}
.tele .v{font-family:var(--mono);font-size:21px;font-weight:800;color:var(--wht);line-height:1.15;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tele .v.amber{color:var(--fd-warn)}.tele .v.grn{color:var(--grn)}
.tele .s{font-family:var(--mono);font-size:10px;color:var(--dim);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wall-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:20px 0 10px}
.wall-h .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--grn)}
.wall-h a{font-family:var(--mono);font-size:11px;color:var(--cy);text-decoration:none}
#obSkyWrap.hero-sky{aspect-ratio:1400/560;min-height:360px}
@media(max-width:900px){#obSkyWrap.hero-sky{aspect-ratio:1000/680;min-height:0}}
#obSkyWrap.hero-sky #obSky{--skyfit:1}
.ob-brand{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:18px 0 10px}
.ob-brand .k{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.ob-brand .k b{color:var(--grn);font-weight:600}
details.ob-all{margin:10px 0 0}details.ob-all summary{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--cy);cursor:pointer}
details.ob-all .ob-list{margin-top:10px}
body[data-page="home"] .hh .lede{display:none}
.findings{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.findings .fc{border:1px solid var(--fd-line);background:var(--fd-panel);border-radius:10px;padding:12px 14px}
.findings .fc .k{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);display:flex;justify-content:space-between}
.findings .fc .k a{color:var(--cy);text-decoration:none}
.findings .fc h4{font-family:var(--sans);font-size:14px;color:var(--wht);margin:4px 0 6px;font-weight:600}

.tele .chip{font-size:8.5px;padding:1px 5px;letter-spacing:.08em}.tele .chip.live::before{width:5px;height:5px;margin-right:3px}
@media(max-width:760px){.tele a{flex:1 1 45%;min-width:0}}

.fdx-lead{stroke:var(--fd-line);stroke-width:1}
