/* PlaneLists ecosystem design system v2 — conforms to Mike's planelists.com brand.
   Shared across our DATA PRODUCTS (not the marketing front door): palette + DM Sans/DM Mono.
   Playfair Display is reserved for Mike's planelists.com and is intentionally NOT used here. */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=DM+Mono:wght@400;500&display=swap');
:root{
  --pl-font:'DM Sans',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --pl-mono:'DM Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --pl-navy:#132338; --pl-navy-panel:#1e293b; --pl-emerald:#10b981; --pl-emerald-bright:#34d399; --pl-teal:#009090; --pl-soft-teal:#5dcaa5;
  --pl-text:#132338; --pl-muted:#5b708a; --pl-faint:#8aa0b6; --pl-line:#dbe6f0; --pl-bg:#f4f7fb; --pl-panel:#ffffff; --pl-panel2:#eef4fb; --pl-accent:#009090;
  --pl-red:#e11d48; --pl-amber:#b45309; --pl-violet:#7c3aed;
}
html[data-pl-theme="dark"]{
  --pl-text:#e8eef7; --pl-muted:#7a90a8; --pl-faint:#5b708a; --pl-line:rgba(122,144,168,.18); --pl-bg:#132338; --pl-panel:#1b2b44; --pl-panel2:rgba(122,144,168,.08); --pl-accent:#34d399;
  --pl-red:#fb7185; --pl-amber:#fbbf24; --pl-violet:#a78bfa;
}
*{box-sizing:border-box}
body{font-family:var(--pl-font) !important;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,input,select,textarea{font-family:var(--pl-font)}
h1,h2,h3,h4{letter-spacing:-.01em;font-weight:600}
code,kbd,samp,.pl-mono{font-family:var(--pl-mono)}
::selection{background:rgba(16,185,129,.24)}
.pl-appbar{display:flex;align-items:center;gap:30px;padding:14px 26px;background:var(--pl-panel);border-bottom:1px solid var(--pl-line);position:sticky;top:0;z-index:50;font-family:var(--pl-font)}
.pl-brand{font-weight:700;font-size:17px;color:var(--pl-text);text-decoration:none;display:flex;align-items:center;gap:8px;white-space:nowrap}
.pl-brand .d{width:10px;height:10px;border-radius:50%;background:var(--pl-emerald);box-shadow:0 0 10px var(--pl-emerald)}
.pl-brand span{color:var(--pl-emerald)}
.pl-nav{display:flex;gap:2px;flex-wrap:wrap}
.pl-nav a{color:var(--pl-muted);text-decoration:none;font-weight:500;font-size:14px;padding:7px 12px;border-radius:8px}
.pl-nav a:hover{color:var(--pl-text)}
.pl-nav a.active{color:var(--pl-accent)}
.pl-sp{flex:1}
.pl-btn{background:var(--pl-teal);color:#fff;border:0;border-radius:999px;padding:10px 20px;font-weight:600;font-size:14px;cursor:pointer;font-family:var(--pl-font);text-decoration:none;display:inline-block}
.pl-btn:hover{background:#007373}
.pl-btn-emerald{background:var(--pl-emerald)} .pl-btn-emerald:hover{background:#0e9f6e}
.pl-btn-ghost{background:transparent;border:1px solid var(--pl-line);color:var(--pl-text);border-radius:999px;padding:9px 17px;font-weight:500;font-size:13.5px;cursor:pointer;font-family:var(--pl-font);text-decoration:none;display:inline-block}
.pl-eyebrow{font-family:var(--pl-mono);font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--pl-teal);display:inline-flex;align-items:center;gap:9px}
.pl-eyebrow::before{content:"—";color:var(--pl-teal)}
.pl-card{background:var(--pl-panel);border:1px solid var(--pl-line);border-radius:14px;padding:24px;box-shadow:0 10px 30px -22px rgba(19,35,56,.35)}
.pl-gauge{background:var(--pl-panel);border:1px solid var(--pl-line);border-radius:13px;padding:16px 18px}
.pl-gauge .n{font-family:var(--pl-mono);font-weight:500;font-size:25px;color:var(--pl-emerald);letter-spacing:-.01em}
.pl-gauge .k{font-family:var(--pl-mono);font-size:11px;font-weight:400;letter-spacing:.08em;text-transform:uppercase;color:var(--pl-faint);margin-top:6px}
.pl-mono-reg{font-family:var(--pl-mono);font-weight:500;color:var(--pl-accent)}
.pl-pill{display:inline-block;font-size:11.5px;font-weight:600;padding:3px 10px;border-radius:999px;border:1px solid transparent}
.pl-pill.red{background:rgba(225,29,72,.12);color:var(--pl-red);border-color:rgba(225,29,72,.28)}
.pl-pill.amber{background:rgba(180,83,9,.12);color:var(--pl-amber);border-color:rgba(180,83,9,.28)}
.pl-pill.violet{background:rgba(124,58,237,.12);color:var(--pl-violet);border-color:rgba(124,58,237,.28)}
.pl-pill.teal{background:rgba(13,148,136,.12);color:var(--pl-teal);border-color:rgba(13,148,136,.3)}
.pl-footer{border-top:1px solid var(--pl-line);padding:34px 26px;color:var(--pl-faint);font-size:13px;background:var(--pl-panel);font-family:var(--pl-font)}
.pl-footer a{color:var(--pl-muted);text-decoration:none;margin-right:16px}
