/* ============================================================
   OX-ENGINE — Blog shared stylesheet
   Brand-aligned with the landing page (dark + orange/gold).
   ============================================================ */
:root{
  --ox-orange:#FF6B00; --ox-gold:#FFA500; --ox-yellow:#FFCC00;
  --ox-black:#0A0A0F; --ox-dark:#1A1A2E; --ox-darker:#0F0F1A;
  --text-1:#f3f3f6; --text-2:#9a9aa6; --text-3:#6a6a78;
  --success:#00D26A; --error:#FF4757; --info:#3498DB;
  --grad:linear-gradient(135deg,#FF6B00 0%,#FFA500 50%,#FFCC00 100%);
  --border:rgba(255,255,255,0.08); --border-orange:rgba(255,165,0,0.25);
  --maxw:760px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--ox-black); color:var(--text-1);
  font-family:'Inter',sans-serif; line-height:1.75; font-size:1.02rem;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
a{color:var(--ox-gold); text-decoration:none}
a:hover{text-decoration:underline}
.aster-ref{color:var(--ox-gold);text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px}
.aster-ref:hover{color:var(--ox-yellow)}
img{max-width:100%}
::selection{background:rgba(255,165,0,.3)}

/* background */
.bg{position:fixed; inset:0; z-index:-1; pointer-events:none; overflow:hidden}
.bg::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,#0a0a0f 0%,#15151f 55%,#0f0f1a 100%)}
.bg::after{content:'';position:absolute;width:520px;height:520px;top:-160px;right:-160px;border-radius:50%;background:#ff6b00;filter:blur(140px);opacity:.14}
.bg-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,165,0,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,165,0,.025) 1px,transparent 1px);background-size:54px 54px}

/* nav */
.nav{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:13px 22px;background:rgba(10,10,15,.72);backdrop-filter:blur(14px);border-bottom:1px solid var(--border)}
.nav-brand{display:flex;align-items:center;gap:10px}
.nav-brand svg,.nav-brand img{width:32px;height:32px;object-fit:contain}
.nav-brand b{font-family:'Orbitron',monospace;font-weight:900;font-size:1rem;letter-spacing:2px;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.nav-links{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.nav-links a{display:inline-flex;align-items:center;gap:6px;font-size:.85rem;color:var(--text-2);font-weight:500;padding:7px 11px;border-radius:10px;border:1px solid transparent;transition:all .25s}
.nav-links a:hover{color:var(--ox-gold);text-decoration:none;background:rgba(255,165,0,.08);border-color:var(--border-orange)}
.nav-links a .ni{width:15px;height:15px;flex-shrink:0}
.nav-links a.nav-join{background:var(--grad);color:#0a0a0f;font-weight:700;padding:8px 16px;border:none;position:relative;overflow:hidden;box-shadow:0 4px 14px rgba(255,165,0,.28)}
.nav-links a.nav-join:hover{background:var(--grad);color:#0a0a0f;text-decoration:none;border:none;transform:translateY(-1px);box-shadow:0 7px 20px rgba(255,165,0,.45)}
.nav-links a.nav-join::after{content:"";position:absolute;top:0;left:-150%;width:55%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:navShine 3.4s ease-in-out infinite}
@keyframes navShine{0%{left:-150%}60%,100%{left:160%}}
.nav-right{display:flex;align-items:center;gap:12px}
.lang{display:flex;gap:3px;background:rgba(255,255,255,.04);border:1px solid var(--border);border-radius:10px;padding:3px}
.lang button{background:transparent;border:none;cursor:pointer;padding:4px 5px;border-radius:7px;line-height:0;transition:background .2s}
.lang button .flag{width:20px;height:14px;display:block;border-radius:3px;overflow:hidden;opacity:.5;transition:opacity .2s}
.lang button:hover .flag{opacity:.85}
.lang button.active{background:rgba(255,165,0,.16);box-shadow:inset 0 0 0 1px rgba(255,165,0,.5)}
.lang button.active .flag{opacity:1}
.btn{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:.85rem;padding:11px 20px;border-radius:12px;
  cursor:pointer;border:1px solid transparent;transition:all .3s;white-space:nowrap}
.btn-primary{background:var(--grad);color:#0a0a0f}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(255,165,0,.32);text-decoration:none}
.btn-ghost{background:rgba(255,255,255,.04);border-color:var(--border);color:var(--text-1)}
.btn-ghost:hover{border-color:var(--border-orange);background:rgba(255,165,0,.07);text-decoration:none}
.btn-lg{padding:15px 28px;font-size:.95rem}

/* layout */
.wrap{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto;padding:0 22px}
.wrap-wide{max-width:1080px}

/* breadcrumb */
.crumb{font-size:.8rem;color:var(--text-3);margin:26px 0 8px}
.crumb a{color:var(--text-2)}

/* article head */
.kicker{display:inline-block;font-family:'Orbitron',monospace;font-size:.68rem;font-weight:700;letter-spacing:2.5px;
  text-transform:uppercase;color:var(--ox-gold);padding:5px 13px;border:1px solid var(--border-orange);
  border-radius:100px;background:rgba(255,165,0,.05);margin-bottom:18px}
.art-h1{font-size:clamp(1.9rem,5vw,2.8rem);line-height:1.18;letter-spacing:-.5px;font-weight:800;margin-bottom:16px}
.art-meta{display:flex;flex-wrap:wrap;gap:14px;align-items:center;color:var(--text-3);font-size:.84rem;margin-bottom:14px}
.art-meta .sep{opacity:.5}
.badge{font-size:.66rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:4px 11px;border-radius:100px;display:inline-flex;align-items:center;gap:6px}
.badge-live{color:var(--success);background:rgba(0,210,106,.1);border:1px solid rgba(0,210,106,.3)}
.badge-soon{color:var(--ox-yellow);background:rgba(255,204,0,.08);border:1px solid rgba(255,204,0,.25)}
.dot{width:7px;height:7px;border-radius:50%;background:var(--success);box-shadow:0 0 9px var(--success);animation:pulse 1.6s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
.art-lead{font-size:1.14rem;color:var(--text-2);margin:18px 0 30px;line-height:1.7}
.hr{height:1px;background:var(--border);border:0;margin:34px 0}

/* article hero cover (branded, animated) */
.art-hero{position:relative;height:230px;border-radius:18px;overflow:hidden;margin:6px 0 32px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border)}
.art-hero .hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:42px 42px;opacity:.5;animation:heroPan 24s linear infinite}
.art-hero .ring{position:absolute;width:300px;height:300px;border-radius:50%;border:1px dashed rgba(255,165,0,.25);animation:heroSpin 40s linear infinite}
.art-hero.hl .ring,.art-hero.cake .ring{border-color:rgba(0,0,0,.18)}
.art-hero .mark{position:relative;z-index:1;width:120px;height:120px;filter:drop-shadow(0 10px 26px rgba(0,0,0,.32));animation:heroFloat 6s ease-in-out infinite}
.art-hero .htag{position:absolute;left:18px;bottom:16px;z-index:2;font-family:'JetBrains Mono',monospace;font-size:.72rem;padding:5px 12px;border-radius:100px;background:rgba(10,10,15,.5);border:1px solid rgba(255,255,255,.16);color:#fff;display:inline-flex;align-items:center;gap:7px}
.art-hero.pillar{background:radial-gradient(120% 160% at 30% 0%,#2c1607,#0e0e16)}
.art-hero.aster{background:radial-gradient(120% 160% at 70% 0%,#241a08,#0e0e16)}
.art-hero.hl{background:linear-gradient(135deg,#57d8c6,#138b7c)}
.art-hero.cake{background:linear-gradient(135deg,#fbf3e4,#dff4f2)}
.art-hero.hl .htag,.art-hero.cake .htag{background:rgba(0,0,0,.32)}
@keyframes heroFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes heroSpin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@keyframes heroPan{from{background-position:0 0}to{background-position:42px 42px}}
@media (max-width:720px){.art-hero{height:180px}.art-hero .mark{width:92px;height:92px}.art-hero .ring{width:220px;height:220px}}

/* TOC */
.toc{background:rgba(255,255,255,.025);border:1px solid var(--border);border-radius:14px;padding:18px 22px;margin:0 0 34px}
.toc b{font-family:'Orbitron',monospace;font-size:.72rem;letter-spacing:1.5px;text-transform:uppercase;color:var(--ox-gold);display:block;margin-bottom:10px}
.toc ol{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px}
.toc a{color:var(--text-2);font-size:.92rem}
.toc a:hover{color:var(--ox-gold)}

/* prose */
.prose{font-size:1.04rem}
.prose h2{font-size:1.5rem;font-weight:700;letter-spacing:-.3px;margin:42px 0 14px;scroll-margin-top:80px}
.prose h3{font-size:1.16rem;font-weight:700;margin:28px 0 10px;color:#fff}
.prose p{margin:0 0 18px;color:#d6d6de}
.prose ul,.prose ol{margin:0 0 20px;padding-left:22px;color:#d6d6de}
.prose li{margin-bottom:9px}
.prose li::marker{color:var(--ox-gold)}
.prose strong{color:#fff;font-weight:600}
.prose a{text-decoration:underline;text-underline-offset:2px}
.prose code{font-family:'JetBrains Mono',monospace;font-size:.86em;background:rgba(255,255,255,.06);
  border:1px solid var(--border);border-radius:6px;padding:1px 6px;color:var(--ox-yellow)}
.prose blockquote{border-left:3px solid var(--ox-gold);margin:0 0 20px;padding:6px 18px;color:var(--text-2);
  background:rgba(255,165,0,.04);border-radius:0 10px 10px 0;font-style:italic}

/* callouts */
.callout{border-radius:14px;padding:18px 20px;margin:24px 0;border:1px solid var(--border);background:rgba(255,255,255,.025);font-size:.96rem}
.callout .t{font-weight:700;margin-bottom:6px;display:flex;align-items:center;gap:8px}
.callout.ok{border-color:rgba(0,210,106,.28);background:rgba(0,210,106,.05)}
.callout.ok .t{color:var(--success)}
.callout.warn{border-color:rgba(255,165,0,.3);background:rgba(255,165,0,.05)}
.callout.warn .t{color:var(--ox-gold)}
.callout.info{border-color:rgba(52,152,219,.3);background:rgba(52,152,219,.06)}
.callout.info .t{color:var(--info)}
.callout p{margin:0;color:#d6d6de}

/* steps */
.steps{list-style:none;padding:0;counter-reset:s;margin:22px 0}
.steps li{position:relative;padding:0 0 18px 52px;counter-increment:s}
.steps li::before{content:counter(s);position:absolute;left:0;top:-2px;width:34px;height:34px;border-radius:10px;
  background:rgba(255,165,0,.1);border:1px solid var(--border-orange);color:var(--ox-gold);
  font-family:'Orbitron',monospace;font-weight:700;display:flex;align-items:center;justify-content:center;font-size:.9rem}
.steps li b{display:block;color:#fff;margin-bottom:2px}
.steps li span{color:var(--text-2);font-size:.95rem}

/* comparison table */
.table-wrap{overflow-x:auto;margin:22px 0}
table.cmp{width:100%;border-collapse:collapse;font-size:.92rem;min-width:520px}
table.cmp th,table.cmp td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--border);vertical-align:top}
table.cmp thead th{font-family:'Orbitron',monospace;font-size:.72rem;letter-spacing:1px;text-transform:uppercase;color:var(--ox-gold)}
table.cmp tbody td:first-child{color:#fff;font-weight:600}
table.cmp tr:hover td{background:rgba(255,255,255,.02)}
@media(max-width:620px){
  table.cmp{min-width:0;font-size:.9rem;display:block}
  table.cmp thead{display:none}
  table.cmp tbody{display:block}
  table.cmp tr{display:block;background:#15151F;border:1px solid var(--border);border-radius:14px;padding:12px 14px;margin-bottom:12px}
  table.cmp tr:hover td{background:none}
  table.cmp th,table.cmp td{display:block;border:0;padding:0}
  table.cmp tbody th,table.cmp th:first-child{color:var(--ox-gold);font-weight:700;font-size:.95rem;padding-bottom:10px}
  table.cmp td{display:flex;justify-content:space-between;gap:14px;padding:7px 0;border-top:1px solid rgba(255,255,255,.05);text-align:right}
  table.cmp td::before{color:var(--text-3);font-weight:600;font-size:.8rem;text-align:left;flex:0 0 96px}
  table.cmp td:nth-of-type(1)::before{content:"OX-ENGINE";color:var(--ox-gold)}
  table.cmp td:nth-of-type(2)::before{content:"3Commas"}
  table.cmp td:nth-of-type(3)::before{content:"Cryptohopper"}
  table.cmp tbody td:first-child{color:var(--text-1)}
}

/* feature pills */
.pills{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 24px}
.pill{font-size:.78rem;color:var(--text-2);background:rgba(255,255,255,.04);border:1px solid var(--border);border-radius:100px;padding:6px 13px}
.pill b{color:var(--ox-gold);font-weight:600}

/* CTA */
.cta{background:linear-gradient(160deg,rgba(255,107,0,.1),rgba(255,165,0,.02));border:1px solid var(--border-orange);
  border-radius:22px;padding:34px 28px;text-align:center;margin:40px 0}
.cta h3{font-size:1.4rem;margin-bottom:8px}
.cta p{color:var(--text-2);margin-bottom:20px}
.cta .row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* related */
.related{margin:48px 0 10px}
.related h2{font-family:'Orbitron',monospace;font-size:.8rem;letter-spacing:2px;text-transform:uppercase;color:var(--ox-gold);margin-bottom:16px}
.rel-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.rel-card{display:block;background:rgba(255,255,255,.025);border:1px solid var(--border);border-radius:14px;padding:18px;transition:all .3s}
.rel-card:hover{border-color:var(--border-orange);transform:translateY(-3px);text-decoration:none;background:rgba(255,165,0,.04)}
.rel-card .c{font-size:.7rem;letter-spacing:1px;text-transform:uppercase;color:var(--text-3);margin-bottom:6px}
.rel-card .h{color:#fff;font-weight:600;font-size:.98rem;line-height:1.35}

/* blog index cards */
.posts{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:30px 0 10px}
.post{display:flex;flex-direction:column;background:linear-gradient(160deg,rgba(255,165,0,.04),rgba(255,255,255,.01));
  border:1px solid var(--border);border-radius:18px;padding:26px;transition:all .35s}
.post:hover{border-color:var(--border-orange);transform:translateY(-5px);text-decoration:none;box-shadow:0 18px 44px rgba(0,0,0,.32)}
.post.feature{grid-column:1/-1}
.post .top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}
.post-cover{position:relative;margin:-26px -26px 18px;border-radius:18px 18px 0 0;overflow:hidden;aspect-ratio:16/9;background:radial-gradient(130% 130% at 50% 0%,rgba(255,107,0,.18),rgba(255,165,0,.05) 45%,rgba(255,255,255,.015))}
.post-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center}
.post.feature .post-cover{aspect-ratio:30/9}
@media (max-width:720px){.post-cover,.post.feature .post-cover{aspect-ratio:16/9}}
.post .cat{font-family:'Orbitron',monospace;font-size:.66rem;letter-spacing:1.5px;text-transform:uppercase;color:var(--ox-gold)}
.post h3{font-size:1.25rem;line-height:1.3;color:#fff;margin-bottom:8px;font-weight:700}
.post p{color:var(--text-2);font-size:.92rem;margin-bottom:16px;flex:1}
.post .read{color:var(--ox-gold);font-weight:600;font-size:.88rem}

/* footer */
footer{position:relative;z-index:1;border-top:1px solid var(--border);background:rgba(10,10,15,.6);padding:42px 22px 56px;margin-top:60px}
.foot{max-width:var(--maxw);margin:0 auto}
.disclaimer{font-size:.78rem;color:var(--text-3);background:rgba(255,255,255,.02);border:1px solid var(--border);border-radius:14px;padding:16px 20px;line-height:1.7;margin-bottom:26px}
.disclaimer b{color:var(--text-2)}
.foot-row{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.foot-brand{display:flex;align-items:center;gap:9px}
.foot-brand svg,.foot-brand img{width:28px;height:28px;object-fit:contain}
.foot-brand b{font-family:'Orbitron',monospace;font-weight:900;letter-spacing:2px;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.foot-links{display:flex;gap:18px;font-size:.84rem}
.foot-links a{color:var(--text-2)}
.foot-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;text-align:left;padding-bottom:24px;margin-bottom:20px;border-bottom:1px solid var(--border)}
.foot-col h4{font-family:'Orbitron',monospace;font-size:.66rem;letter-spacing:1.5px;text-transform:uppercase;color:var(--ox-gold);margin:0 0 12px}
.foot-col a{display:block;color:var(--text-2);font-size:.86rem;padding:5px 0}
.foot-col a:hover{color:var(--ox-gold)}
@media(max-width:700px){.foot-cols{grid-template-columns:repeat(2,1fr);gap:14px 18px}}
.copyright{font-size:.76rem;color:var(--text-3);margin-top:20px;text-align:center}

@media (max-width:720px){
  .nav{flex-wrap:wrap;row-gap:8px;padding:11px 16px}
  .nav-links{order:3;width:100%;justify-content:center;gap:6px}
  .rel-grid,.posts{grid-template-columns:1fr}
}
/* ===== Backlog / changelog page ===== */
.bl-wrap{max-width:840px}
.bl-sec{font-family:'Orbitron',monospace;font-size:.72rem;letter-spacing:1.5px;text-transform:uppercase;color:var(--ox-gold);margin:42px 0 20px;display:flex;align-items:center;gap:10px}
.bl-sec::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--border-orange),transparent)}
.bl-list{list-style:none;padding:0;margin:0;position:relative}
.bl-list::before{content:"";position:absolute;left:7px;top:8px;bottom:8px;width:1px;background:linear-gradient(180deg,transparent,var(--border-orange),transparent)}
.bl-item{position:relative;padding:0 0 26px 32px}
.bl-item::before{content:"";position:absolute;left:3px;top:5px;width:9px;height:9px;border-radius:50%;background:var(--ox-gold);box-shadow:0 0 8px rgba(255,165,0,.55)}
.bl-item.plan::before{background:transparent;border:1px solid #FFCC00;box-shadow:none}
.bl-tag{display:inline-block;font-family:'Orbitron',monospace;font-size:.56rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:3px 9px;border-radius:100px;margin-bottom:9px}
.bl-tag.new{color:#00D26A;background:rgba(0,210,106,.1);border:1px solid rgba(0,210,106,.25)}
.bl-tag.imp{color:var(--ox-gold);background:rgba(255,165,0,.1);border:1px solid rgba(255,165,0,.28)}
.bl-tag.plan{color:#FFCC00;background:rgba(255,204,0,.08);border:1px solid rgba(255,204,0,.28)}
.bl-item h3{font-size:1.06rem;margin:0 0 5px;color:#fff;letter-spacing:-.2px}
.bl-item p{margin:0;color:var(--text-2);font-size:.93rem;line-height:1.5}
.bl-note{margin:30px 0 0;font-size:.8rem;color:#8a8a96}
@media (max-width:560px){.bl-item{padding-left:28px}.bl-item h3{font-size:1rem}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}