/* Figma landing (17:4 dark / 17:433 light) — follows html.dark, not forest palette. */
.ld-page {
    --ld-bg: #faf9f6;
    --ld-card: #ffffff;
    --ld-inset: #faf9f6;
    --ld-border: #d4d2c9;
    --ld-border-2: #e5e3dc;
    --ld-text: #111213;
    --ld-muted: #5b5e63;
    --ld-faint: #888b90;
    --ld-accent: #ff5500;
    --ld-accent-ink: #faf9f6;
    --ld-ok: #00b34a;
    --ld-ok-bg: rgba(0, 179, 74, 0.07);
    --ld-accent-bg: rgba(255, 85, 0, 0.07);
    background: var(--ld-bg);
    color: var(--ld-text);
    font-family: Geist, "Plus Jakarta Sans", system-ui, sans-serif;
}
html.dark .ld-page {
    --ld-bg: #111213;
    --ld-card: #17181a;
    --ld-inset: #17181a;
    --ld-border: #2d3032;
    --ld-border-2: #2d3032;
    --ld-text: #ecebe4;
    --ld-muted: #9a9c9f;
    --ld-faint: #686b6e;
    --ld-accent: #ff5500;
    --ld-accent-ink: #111213;
    --ld-ok: #00ff66;
    --ld-ok-bg: rgba(0, 255, 102, 0.06);
    --ld-accent-bg: rgba(255, 85, 0, 0.1);
}
.ld-page .font-display { font-family: Archivo, sans-serif; font-weight: 900; font-stretch: 100%; }
.ld-brand, .ld-brand .font-display { color: var(--ld-text) !important; }
.ld-brand .ld-dot { color: var(--ld-accent) !important; }
.ld-page .font-mono { font-family: "JetBrains Mono", ui-monospace, monospace; }
.ld-wrap { max-width: 1440px; margin: 0 auto; padding-left: 1.25rem; padding-right: 1.25rem; }
@media (min-width: 1024px) {
    .ld-wrap { padding-left: 80px; padding-right: 80px; }
}
.ld-nav {
    height: 80px;
    border-bottom: 1px solid var(--ld-border);
    background: var(--ld-bg);
    position: sticky; top: 0; z-index: 50;
}
.ld-dot { color: var(--ld-accent); }
.ld-badge {
    border: 1px solid var(--ld-accent);
    background: var(--ld-accent-bg);
    color: var(--ld-accent);
    font-family: "JetBrains Mono", monospace;
    font-weight: 700;
    font-size: 10px;
    padding: 2px 8px;
    text-transform: none;
}
.ld-ok {
    border: 1px solid var(--ld-ok);
    background: var(--ld-ok-bg);
    color: var(--ld-ok);
    font-family: "JetBrains Mono", monospace;
    font-weight: 700;
    font-size: 11px;
    text-transform: uppercase;
    padding: 4px 10px;
    display: inline-flex; align-items: center; gap: 6px;
}
.ld-ok i { width: 6px; height: 6px; border-radius: 50%; background: var(--ld-ok); display: block; }
.ld-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    font-family: "JetBrains Mono", monospace; font-weight: 700; font-size: 13px;
    text-transform: uppercase; letter-spacing: 0;
    padding: 14px 24px; border: 1px solid var(--ld-border);
    background: var(--ld-card); color: var(--ld-text);
}
.ld-btn img { width: 14px; height: 14px; display: block; }
.ld-btn-primary {
    background: var(--ld-accent); border-color: var(--ld-accent); color: var(--ld-accent-ink);
}
.ld-card { background: var(--ld-card); border: 1px solid var(--ld-border); }
/* Dashboard launchpad tiles: hairline from the text color so cards
   separate from each other in both themes (dark --ld-border is too close
   to --ld-card to read as an edge). */
.ld-menu-card {
    border-width: 1px;
    border-style: solid;
    border-color: color-mix(in srgb, var(--ld-text) 20%, transparent);
}
.ld-metric { background: var(--ld-inset); border: 1px solid var(--ld-border-2); padding: 16px; }
.ld-kicker {
    display: flex; align-items: center; gap: 8px;
    font-family: "JetBrains Mono", monospace; font-size: 12px;
    text-transform: uppercase; color: var(--ld-muted);
}
.ld-kicker span { width: 12px; height: 2px; background: var(--ld-accent); display: block; }
.ld-h { font-family: Archivo, sans-serif; font-weight: 900; letter-spacing: -0.02em; color: var(--ld-text); }
.ld-section { border-bottom: 1px solid var(--ld-border); padding: 80px 0; }
.ld-label { font-family: "JetBrains Mono", monospace; font-size: 11px; text-transform: uppercase; color: var(--ld-muted); }
.ld-links a { font-family: "JetBrains Mono", monospace; font-size: 13px; text-transform: uppercase; color: var(--ld-muted); }
.ld-links a:hover { color: var(--ld-text); }
.ld-spark { width: 100%; height: 80px; display: block; }
.ld-bar { height: 8px; background: var(--ld-accent); }
html.dark .ld-page .ld-arrow-on-dark { filter: none; }
.ld-page .ld-arrow-light { filter: none; }