/* KB Algo Lab — design system v2 (dark, IBM Plex Sans/Mono, green accent).
   Shared across index/leaderboard/pricing/download/terms/privacy/account/my-account. */
:root{
  --bg:#070b10; --panel:#0a0f16; --panel2:#0b1219; --line:#17222f; --line2:#101a24;
  --txt:#e9f1f7; --txt2:#f2f7fb; --dim:#93a4b6; --dim2:#8ea0b2; --dim3:#6b7c8e; --dim4:#5d6f81;
  --accent:#4be08a; --accent-dark:#06210f; --accent-glow:#1c3a2c; --accent-bg:#0c1a13;
  --neg:#e0564b; --neg2:#e0736b;
}
*{box-sizing:border-box}
body.d2{margin:0;background:var(--bg);font-family:'IBM Plex Sans',system-ui,sans-serif;-webkit-font-smoothing:antialiased;color:var(--txt)}
.d2 a{color:inherit;text-decoration:none}
.d2 a.nav:hover{color:var(--accent)}
.d2 h1,.d2 h2,.d2 h3,.d2 p{margin:0}
.d2 .mono{font-family:'IBM Plex Mono',monospace;font-variant-numeric:tabular-nums}
.d2 .wrap{max-width:1200px;margin:0 auto;padding:0 40px}
.d2 .wrap.narrow{max-width:820px}
.d2 .wrap.mid{max-width:1100px}
@media(max-width:700px){.d2 .wrap{padding:0 20px}}

.d2 .btn-p{font-family:'IBM Plex Mono',monospace;font-size:15px;font-weight:600;background:var(--accent);color:var(--accent-dark);padding:14px 26px;border-radius:9px;display:inline-block;border:none;cursor:pointer;transition:background .15s}
.d2 .btn-p:hover{background:#63e89b}
.d2 .btn-p:disabled{opacity:.5;cursor:not-allowed}
.d2 .btn-s{font-family:'IBM Plex Mono',monospace;font-size:15px;color:#cdd9e4;border:1px solid #23303e;background:transparent;padding:14px 26px;border-radius:9px;display:inline-block;cursor:pointer;transition:border-color .15s,color .15s}
.d2 .btn-s:hover{border-color:#3a4b5c;color:#fff}

@keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.28}}
@keyframes blink{50%{opacity:0}}
.d2 .fu{opacity:0;animation:fadeUp .7s cubic-bezier(.2,.7,.3,1) both}
.d2 .reveal{opacity:0;transform:translateY(20px);transition:opacity .6s cubic-bezier(.2,.7,.3,1),transform .6s cubic-bezier(.2,.7,.3,1)}
.d2 .reveal.in{opacity:1;transform:none}
.d2 .cursor{display:inline-block;width:8px;height:15px;background:var(--accent);margin-left:2px;vertical-align:-2px;animation:blink 1.05s step-end infinite}

/* nav */
.d2 header.d2nav{position:sticky;top:0;z-index:50;background:rgba(7,11,16,.82);backdrop-filter:blur(10px);border-bottom:1px solid var(--line2)}
.d2 header.d2nav .inner{display:flex;align-items:center;justify-content:space-between;height:66px}
.d2 .brand{display:flex;align-items:center;gap:11px}
.d2 .brand .logo{width:26px;height:26px;border-radius:6px;background:var(--accent);display:flex;align-items:center;justify-content:center}
.d2 .brand .logo i{width:9px;height:9px;background:var(--bg);border-radius:2px;display:block}
.d2 .brand span{font-weight:600;letter-spacing:.02em}
.d2 .navlinks{display:flex;align-items:center;gap:30px}
.d2 .navlinks a{font-size:14px;color:var(--dim2)}
.d2 .navlinks a.active{color:var(--accent)}
.d2 .navlinks a.cta{color:var(--accent);border:1px solid #245240;padding:8px 16px;border-radius:7px}
@media(max-width:820px){.d2 .navlinks{gap:16px}.d2 .navlinks a{font-size:12.5px}}
.d2 .navburger{display:none;background:none;border:none;color:var(--txt);font-size:22px;line-height:1;cursor:pointer;padding:4px 6px}
@media(max-width:700px){
  .d2 .navburger{display:block}
  .d2 .navlinks{display:none;position:absolute;top:66px;left:0;right:0;flex-direction:column;align-items:stretch;
    gap:0;background:var(--panel);border-bottom:1px solid var(--line);padding:8px 0;
    box-shadow:0 16px 30px -18px rgba(0,0,0,.6)}
  .d2 .navlinks.open{display:flex}
  .d2 .navlinks a{font-size:15px;padding:13px 24px;border-bottom:1px solid var(--line2)}
  .d2 .navlinks a.cta{border:1px solid #245240;margin:10px 24px;text-align:center;border-radius:7px}
}

/* pills / badges */
.d2 .pill{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:var(--accent);border:1px solid var(--accent-glow);background:var(--accent-bg);padding:6px 12px;border-radius:100px;letter-spacing:.06em}
.d2 .pill .dot{width:6px;height:6px;border-radius:50%;background:var(--accent);animation:pulse 1.8s ease-in-out infinite}

/* cards */
.d2 .card{border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:26px;transition:transform .25s cubic-bezier(.2,.7,.3,1),border-color .25s}
.d2 .card.hoverlift:hover{transform:translateY(-4px)}
.d2 .honest-note{display:flex;align-items:center;gap:12px;padding:16px 20px;border:1px solid #143323;background:#0a1610;border-radius:10px}
.d2 .honest-note .tick{color:var(--accent);font-size:16px}
.d2 .honest-note span.txt{font-size:14px;color:#8a9a90;line-height:1.5}

/* footer */
.d2 footer.d2foot{border-top:1px solid var(--line2);background:#080d13}
.d2 footer.d2foot .inner{display:flex;align-items:center;justify-content:space-between;padding:26px 40px;flex-wrap:wrap;gap:14px}
.d2 footer.d2foot .brand .logo{width:22px;height:22px}
/* Wraps instead of forcing the page sideways. The footer links sat on one unbreakable row, so on
   very narrow screens the email address pushed past the viewport and the whole page scrolled
   horizontally (measured on pricing.html before the FAQ page existed - it was never FAQ-specific). */
.d2 footer.d2foot .links{display:flex;gap:26px;flex-wrap:wrap;row-gap:10px}
.d2 footer.d2foot .links a{overflow-wrap:anywhere}
.d2 footer.d2foot .links a{font-size:13px;color:var(--dim3)}
.d2 footer.d2foot .links a:hover{color:var(--accent)}

/* section labels */
.d2 .kicker{font-size:13px;color:var(--dim3);letter-spacing:.14em;text-transform:uppercase;margin-bottom:10px}
.d2 h2.sec{font-size:34px;font-weight:600;color:var(--txt2);letter-spacing:-.02em}

/* forms */
.d2 input[type=text],.d2 input[type=email],.d2 input[type=password],.d2 input[type=date],.d2 input[type=number]{
  width:100%;background:#0d151d;border:1px solid var(--line);color:var(--txt);border-radius:9px;padding:12px 14px;
  font-family:'IBM Plex Sans',sans-serif;font-size:14.5px;outline:none}
.d2 input:focus{border-color:var(--accent)}
.d2 label{display:block;font-size:12.5px;color:var(--dim3);margin-bottom:6px;font-weight:500}

/* generic table (leaderboard-style) */
.d2 table.d2table{width:100%;border-collapse:collapse;font-size:13.5px}
.d2 table.d2table th{text-align:left;font-size:11px;color:var(--dim4);letter-spacing:.06em;text-transform:uppercase;padding:14px 22px;border-bottom:1px solid #131d29;background:#0b1219}
.d2 table.d2table td{padding:15px 22px;border-bottom:1px solid #0e1620}
.d2 table.d2table tr.lrow{transition:background .15s}
.d2 table.d2table tr.lrow:hover{background:#0d151d}