/* Shared stylesheet for NeoTLog content pages (/import/*, and any guide that
   follows). The app and the landing page inline everything; these pages are
   plain text documents, so they share one small file instead.

   The tokens below are copied from index.html so a content page matches the
   landing page in both themes — if that palette changes, change it here too.
   Cached for a week by _headers (/assets/*), so bump the ?v= on the <link>
   when this file changes. */

:root{
  --bg:#0a0c0f; --surface:#111418; --surface2:#181c22; --border:#222831;
  --select:#0891b2; --text:#e8eaed; --text2:#8b9099; --text3:#555c66;
  --win:#00e5a0; --loss:#ff4d6d; --accent3:#f5a623;
  --nav-bg:rgba(10,12,15,.72); --on-select:#04181f;
  --mono:'Space Mono',monospace; --sans:'Syne',sans-serif;
  --maxw:1240px; --readw:860px;   /* 860 = the measure privacy/terms/updates use */
}
html[data-theme="light"]{
  --bg:#f4f5f7; --surface:#ffffff; --surface2:#eceef1; --border:#d9dde3;
  --select:#0e7f9e; --text:#1a1d21; --text2:#545a63; --text3:#878e97;
  --win:#0a9d74; --loss:#d84357; --accent3:#c67f14;
  --nav-bg:rgba(244,245,247,.82); --on-select:#ffffff;
}

*{box-sizing:border-box;margin:0;padding:0;}
body{background:var(--bg);color:var(--text);font-family:var(--sans);line-height:1.65;-webkit-font-smoothing:antialiased;}
a{color:var(--select);text-decoration:none;}
a:hover{text-decoration:underline;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}
.read{max-width:var(--readw);}

/* ── page bar ────────────────────────────────────────────────────────────── */
/* Same shape as privacy.html, terms.html and updates.html: logo on the left, a
   back link on the right. These pages carry one sign-up button as well, which the
   legal pages have no reason to — this is where cold search traffic lands. */
header.pagebar{position:sticky;top:0;z-index:50;background:var(--surface);border-bottom:1px solid var(--border);}
.top{display:flex;align-items:center;justify-content:space-between;gap:16px;height:64px;}   /* 64 = the landing nav height, so the sign-up button is full size */
.logo{display:flex;align-items:center;}
.logo:hover{text-decoration:none;}
.logo-img{height:28px;width:auto;display:block;}   /* same wordmark and size as the legal pages */
.bar-right{display:flex;align-items:center;gap:18px;}
.back{color:var(--text3);font-size:13px;}
.back:hover{color:var(--text2);text-decoration:none;}
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--sans);font-weight:700;font-size:14px;line-height:1.6;border-radius:8px;padding:11px 20px;cursor:pointer;border:1px solid transparent;transition:transform .12s ease,opacity .12s ease;}   /* identical to the landing page button */
.btn:hover{transform:translateY(-1px);text-decoration:none;}
.btn-primary{background:var(--select);color:var(--on-select);}
.btn-ghost{background:transparent;color:var(--text);border-color:var(--border);}

/* ── article ─────────────────────────────────────────────────────────────── */
main{padding:48px 0 72px;}
.crumbs{font-size:13px;color:var(--text3);margin-bottom:22px;}
.crumbs a{color:var(--text2);}
h1{font-size:clamp(30px,5vw,42px);line-height:1.15;letter-spacing:-.02em;font-weight:800;margin-bottom:18px;}
h2{font-size:24px;line-height:1.25;letter-spacing:-.01em;font-weight:700;margin:44px 0 14px;}
h3{font-size:17px;font-weight:700;margin:26px 0 10px;}
p{margin-bottom:16px;color:var(--text);}
.lede{font-size:18px;color:var(--text2);}
ol,ul{margin:0 0 18px 22px;}
li{margin-bottom:8px;}
li::marker{color:var(--text3);}
strong{font-weight:700;}
code{font-family:var(--mono);font-size:13px;background:var(--surface2);border:1px solid var(--border);border-radius:5px;padding:1px 6px;color:var(--text);}
pre{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:16px;overflow-x:auto;margin-bottom:8px;}
pre code{background:none;border:none;padding:0;font-size:12.5px;line-height:1.7;white-space:pre;color:var(--text2);}
.cap{font-size:13px;color:var(--text3);margin-bottom:22px;}
.note{border-left:2px solid var(--select);background:var(--surface);border-radius:0 10px 10px 0;padding:14px 18px;margin:22px 0;}
.note p:last-child{margin-bottom:0;}
figure{margin:24px 0;}
figure img{width:100%;height:auto;border:1px solid var(--border);border-radius:12px;display:block;}   /* height:auto — the width/height attributes only reserve the aspect ratio */
figcaption{font-size:13px;color:var(--text3);margin-top:8px;}

/* ── faq ─────────────────────────────────────────────────────────────────── */
details{border-bottom:1px solid var(--border);padding:14px 0;}
details summary{cursor:pointer;font-weight:700;font-size:16px;list-style:none;display:flex;justify-content:space-between;gap:16px;}
details summary::-webkit-details-marker{display:none;}
details summary::after{content:'+';color:var(--text3);font-family:var(--mono);}
details[open] summary::after{content:'−';}
details p{margin:12px 0 0;color:var(--text2);}

/* ── cta ─────────────────────────────────────────────────────────────────── */
.cta{border:1px solid var(--border);background:var(--surface);border-radius:14px;padding:28px;margin:44px 0 0;text-align:center;}
.cta h2{margin-top:0;}
.cta p{color:var(--text2);}
.cta-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:18px;}

/* ── footer ──────────────────────────────────────────────────────────────── */
footer{border-top:1px solid var(--border);padding:40px 0 32px;background:var(--surface);margin-top:64px;}
.foot-row{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:13px;color:var(--text3);}
.foot-row a{color:var(--text2);}
.foot-links{display:flex;gap:16px;flex-wrap:wrap;}
/* The risk, sample-data and trademark disclosures. Readable size and colour on purpose: NinjaTrader's
   vendor guidelines want them "in same or similar style text as the primary content", not fine print. */
.foot-disclaim{font-size:14px;color:var(--text2);margin-top:20px;line-height:1.6;}
.foot-disclaim p{margin:0;color:var(--text2);}
.foot-disclaim p+p{margin-top:10px;}
.foot-disclaim strong{color:var(--text);font-weight:600;}
/* Always the last line on the page — same wording and position everywhere. */
.page-updated{font-family:var(--mono);font-size:12px;color:var(--text3);margin-top:18px;}

@media(max-width:760px){
  .back{display:none;}
  main{padding:32px 0 56px;}
  h2{font-size:21px;}
}