/* Ariadne theme: indigo ink, the red thread, a touch of gold. */
:root {
  --ar-ink: #0d1226;
  --ar-ink-2: #141b3a;
  --ar-indigo: #3949ab;
  --ar-indigo-light: #7986cb;
  --ar-thread: #ff5a36;
  --ar-gold: #f2a900;
  --ar-mist: #c9cff5;
  --ar-radius: 14px;
  --md-primary-fg-color: #2f3d93;
  --md-primary-fg-color--light: #5664c2;
  --md-primary-fg-color--dark: #1d2768;
  --md-accent-fg-color: #ff5a36;
  --md-accent-fg-color--transparent: rgba(255, 90, 54, 0.1);
}
[data-md-color-scheme="slate"] {
  --md-hue: 232;
  --md-default-bg-color: #0f1324;
  --md-primary-fg-color: #141b3a;
  --md-typeset-a-color: #8f9cf0;
}
[data-md-color-scheme="default"] { --md-typeset-a-color: #2f3d93; }

.md-header, .md-tabs { background: linear-gradient(90deg, #121a38, #1d2768); }
.md-typeset h1 { font-weight: 800; letter-spacing: -0.02em; }
.md-typeset h2 { font-weight: 700; letter-spacing: -0.01em; }
.md-typeset img { border-radius: 10px; }
.md-typeset .katex-display { overflow-x: auto; overflow-y: hidden; padding: 0.2em 0; }
.md-typeset table:not([class]) { font-size: 0.72rem; }

/* ------------------------------------------------------------ landing */
.ar-home { --ar-w: 1220px; color: var(--md-default-fg-color); font-size: 0.8rem; line-height: 1.6; }
.ar-home a { text-decoration: none; }
.ar-wrap { max-width: var(--ar-w); margin: 0 auto; padding: 0 1.2rem; }
.ar-hero {
  color: #fff;
  background:
    radial-gradient(1200px 500px at 85% -10%, rgba(255, 90, 54, 0.28), transparent 60%),
    radial-gradient(900px 500px at 10% 120%, rgba(57, 73, 171, 0.55), transparent 60%),
    linear-gradient(160deg, #0b1022 0%, #141b3a 55%, #1b2563 100%);
  position: relative;
  overflow: hidden;
}
.ar-hero::before {           /* faint maze grid */
  content: ""; position: absolute; inset: 0; opacity: 0.09; pointer-events: none;
  background-image:
    linear-gradient(#c9cff5 2px, transparent 2px),
    linear-gradient(90deg, #c9cff5 2px, transparent 2px);
  background-size: 54px 54px;
  mask-image: radial-gradient(ellipse at 70% 40%, #000 20%, transparent 75%);
}
.ar-hero__grid { display: grid; grid-template-columns: 1.25fr 1fr; gap: 3rem; padding: 4.5rem 1.2rem 4rem;
  align-items: center; position: relative; }
.ar-eyebrow { text-transform: uppercase; letter-spacing: 0.16em; font-size: 0.68rem; color: var(--ar-mist);
  opacity: 0.85; margin: 0 0 0.6rem; }
.ar-title { font-size: clamp(3rem, 7vw, 5.4rem); line-height: 1; margin: 0 0 1.2rem; font-weight: 900;
  letter-spacing: -0.04em; color: #fff; }
.ar-title span { color: var(--ar-thread); }
.ar-lead { font-size: 1.05rem; line-height: 1.65; color: #dfe3ff; max-width: 38rem; margin: 0 0 1.8rem; }
.ar-lead strong { color: #fff; }
.ar-meta { font-size: 0.7rem; color: var(--ar-mist); opacity: 0.8; margin-top: 1.4rem; }
.ar-meta a { color: #fff; border-bottom: 1px solid rgba(255, 255, 255, 0.35); }
.ar-cta { display: flex; flex-wrap: wrap; gap: 0.7rem; }

.ar-btn { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.7rem 1.15rem; border-radius: 999px;
  font-weight: 700; font-size: 0.78rem; border: 1px solid rgba(255, 255, 255, 0.28); color: #fff !important;
  background: rgba(255, 255, 255, 0.06); cursor: pointer; transition: transform 0.15s, background 0.15s; }
.ar-btn:hover { transform: translateY(-1px); background: rgba(255, 255, 255, 0.14); }
.ar-btn--primary { background: #fff; color: var(--ar-ink) !important; border-color: #fff; }
.ar-btn--primary:hover { background: #e8ebff; }
.ar-btn--thread { background: var(--ar-thread); border-color: var(--ar-thread); }
.ar-btn--thread:hover { background: #ff7656; }
.ar-btn--light { background: #fff; color: #b33a1d !important; border-color: #fff; }
.ar-btn--ghost { border-color: rgba(255, 255, 255, 0.6); }
.ar-btn--small { padding: 0.45rem 0.9rem; font-size: 0.7rem; }
.ar-band:not(.ar-band--dark):not(.ar-band--thread) .ar-btn { color: var(--md-primary-fg-color) !important;
  border-color: var(--md-primary-fg-color); background: transparent; }
[data-md-color-scheme="slate"] .ar-band:not(.ar-band--dark):not(.ar-band--thread) .ar-btn { color: #c9cff5 !important;
  border-color: #5664c2; }

.ar-hero__card { background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 22px; padding: 1.4rem; backdrop-filter: blur(8px); }
.ar-kpis { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.ar-kpi { background: rgba(10, 14, 32, 0.45); border-radius: var(--ar-radius); padding: 1.1rem 1rem; }
.ar-kpi b { display: block; font-size: 1.85rem; font-weight: 900; letter-spacing: -0.03em; color: #fff; }
.ar-kpi:nth-child(1) b { color: var(--ar-thread); }
.ar-kpi:nth-child(4) b { color: var(--ar-gold); }
.ar-kpi span { font-size: 0.68rem; line-height: 1.4; color: var(--ar-mist); }

.ar-band { padding: 4rem 0; }
.ar-band--dark { background: #0b1022; color: #e6e9ff; }
.ar-band--tint { background: var(--md-code-bg-color); }
.ar-band--thread { background: linear-gradient(120deg, #c8381a, #ff5a36 55%, #f2a900); color: #fff; }
.ar-band--thread p { color: #fff3ee; }
.ar-h2 { font-size: 1.85rem; font-weight: 850; letter-spacing: -0.02em; margin: 0 0 0.6rem; }
.ar-band--dark .ar-h2 { color: #fff; }
.ar-sub { max-width: 52rem; opacity: 0.85; margin: 0 0 2rem; line-height: 1.6; font-size: 0.9rem; }

.ar-race { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.1rem; }
.ar-race__lane { background: #10162e; border: 1px solid #222b55; border-radius: var(--ar-radius); padding: 0.8rem;
  position: relative; }
.ar-race__lane canvas { width: 100%; aspect-ratio: 1 / 1; display: block; }
.ar-race__label { display: flex; justify-content: space-between; align-items: baseline; margin-top: 0.6rem;
  font-size: 0.78rem; color: #c9cff5; }
.ar-race__label b { font-variant-numeric: tabular-nums; font-size: 1.05rem; color: #fff; }
.ar-race__lane.winner { border-color: var(--ar-gold); box-shadow: 0 0 0 1px var(--ar-gold), 0 10px 40px rgba(242, 169, 0, 0.15); }
.ar-race__controls { display: flex; gap: 0.7rem; align-items: center; margin-top: 1.2rem; }
.ar-race__clock { font-variant-numeric: tabular-nums; color: #8f9cf0; font-size: 0.85rem; margin-left: auto; }

.ar-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.1rem; }
.ar-card { display: block; padding: 1.4rem; border-radius: var(--ar-radius); border: 1px solid var(--md-default-fg-color--lightest);
  background: var(--md-default-bg-color); transition: transform 0.15s, border-color 0.15s, box-shadow 0.15s;
  color: var(--md-default-fg-color) !important; position: relative; overflow: hidden; }
.ar-card::before { content: ""; position: absolute; left: 0; top: 0; height: 3px; width: 100%;
  background: linear-gradient(90deg, var(--ar-indigo), var(--ar-thread)); opacity: 0.85; }
.ar-card:hover { transform: translateY(-3px); border-color: var(--ar-indigo-light); box-shadow: 0 12px 30px rgba(20, 27, 58, 0.15); }
.ar-card h3 { margin: 0.2rem 0 0.5rem; font-size: 1rem; font-weight: 800; }
.ar-card p { margin: 0; font-size: 0.78rem; line-height: 1.6; opacity: 0.85; }

.ar-flow { list-style: none; display: grid; grid-template-columns: repeat(6, 1fr); gap: 0.7rem; padding: 0; margin: 1.6rem 0 0;
  counter-reset: step; }
.ar-flow li { margin: 0 !important; padding: 1rem 0.9rem; border-radius: 12px; background: var(--md-default-bg-color);
  border: 1px solid var(--md-default-fg-color--lightest); position: relative; counter-increment: step; }
.ar-flow li::before { content: counter(step, decimal-leading-zero); font-size: 0.62rem; font-weight: 800;
  color: var(--ar-thread); letter-spacing: 0.1em; }
.ar-flow b { display: block; font-size: 0.9rem; margin: 0.2rem 0 0.3rem; }
.ar-flow span { font-size: 0.68rem; opacity: 0.8; line-height: 1.45; display: block; }

.ar-figs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.1rem; }
.ar-figs a { display: block; border-radius: var(--ar-radius); overflow: hidden; border: 1px solid var(--md-default-fg-color--lightest);
  background: #fff; transition: transform 0.15s; }
.ar-figs a:hover { transform: translateY(-3px); }
.ar-figs img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: top left; display: block; }
.ar-figs span { display: block; padding: 0.8rem 1rem; font-size: 0.75rem; color: #1f2433; font-weight: 600; }

.ar-split { display: grid; grid-template-columns: 1.2fr 1fr; gap: 3rem; align-items: center; }
.ar-timeline { list-style: none; margin: 0; padding: 0; border-left: 2px solid var(--md-default-fg-color--lightest); }
.ar-timeline li { margin: 0 0 1rem 0 !important; padding-left: 1.2rem; position: relative; font-size: 0.8rem; }
.ar-timeline li::before { content: ""; position: absolute; left: -7px; top: 0.3rem; width: 12px; height: 12px;
  border-radius: 50%; background: var(--md-default-bg-color); border: 2px solid var(--ar-indigo-light); }
.ar-timeline li.done::before { background: var(--ar-thread); border-color: var(--ar-thread); }
.ar-timeline b { margin-right: 0.4rem; }
.ar-sponsor { display: flex; gap: 0.8rem; flex-wrap: wrap; justify-content: flex-end; }

@media (max-width: 960px) {
  .ar-hero__grid, .ar-split { grid-template-columns: 1fr; gap: 2rem; padding-top: 3rem; }
  .ar-race, .ar-cards, .ar-figs { grid-template-columns: 1fr; }
  .ar-flow { grid-template-columns: 1fr 1fr; }
  .ar-sponsor { justify-content: flex-start; }
}

/* ------------------------------------------------------------ docs pages */
.ar-chart { width: 100%; min-height: 380px; margin: 1rem 0 1.6rem; border-radius: 12px;
  border: 1px solid var(--md-default-fg-color--lightest); }
.ar-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0.8rem; margin: 1rem 0 1.6rem; }
.ar-stat { border: 1px solid var(--md-default-fg-color--lightest); border-radius: 12px; padding: 0.9rem 1rem; }
.ar-stat b { display: block; font-size: 1.45rem; font-weight: 850; letter-spacing: -0.02em; color: var(--md-typeset-a-color); }
.ar-stat span { font-size: 0.68rem; opacity: 0.8; }
.ar-tier { border: 1px solid var(--md-default-fg-color--lightest); border-radius: 14px; padding: 1.1rem 1.2rem; margin: 0 0 1rem; }
.ar-tier h3 { margin-top: 0 !important; }
.ar-tier .ar-price { float: right; font-weight: 850; color: var(--ar-thread); font-size: 1.05rem; }
