/* Extracted Matrix sign-in styles; see matrix-source.json. */

    :root {
      color-scheme:light;
      --bg:#f7f8fa;
      --surface:#ffffff;
      --surface-soft:#f0f3ff;
      --ink:#111c2d;
      --muted:#464555;
      --faint:#777587;
      --line:#c7c4d8;
      --line-soft:#e2e8f0;
      --primary:#493ee5;
      --primary-soft:#e2dfff;
      --success:#00714d;
      --success-soft:#d7f8e7;
      --danger:#ba1a1a;
      --danger-soft:#ffdad6;
      --shadow:0 1px 2px rgba(0,0,0,.05);
      --shadow-hover:0 18px 38px -18px rgba(30,41,59,.18);
    }
    * { box-sizing:border-box; letter-spacing:0; }
    html { min-height:100%; background:var(--bg); }
    body {
      min-height:100vh;
      margin:0;
      display:grid;
      place-items:center;
      background:var(--bg);
      color:var(--ink);
      font-family:ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
      padding:24px;
    }
    .signin-shell {
      width:min(760px, 100%);
      display:grid;
      gap:18px;
      justify-items:center;
    }
    .signin-brand {
      display:flex;
      align-items:center;
      justify-content:center;
      gap:12px;
      width:100%;
    }
    .brand-mark {
      width:40px;
      height:40px;
      border:1px solid var(--line);
      border-radius:12px;
      display:grid;
      place-items:center;
      color:var(--primary);
      background:var(--surface);
      box-shadow:var(--shadow);
    }
    .brand-mark svg {
      width:20px;
      height:20px;
      fill:none;
      stroke:currentColor;
      stroke-width:2;
      stroke-linecap:round;
      stroke-linejoin:round;
    }
    .brand-copy {
      display:grid;
      gap:1px;
    }
    .brand-copy strong {
      font-size:24px;
      line-height:1.05;
      font-weight:850;
    }
    .brand-copy span {
      color:var(--faint);
      font-size:12px;
      line-height:1.2;
      font-weight:750;
    }
    .signin-card {
      width:100%;
      border:1px solid var(--line-soft);
      border-radius:18px;
      background:var(--surface);
      padding:30px;
      box-shadow:var(--shadow-hover);
      display:grid;
      gap:17px;
    }
    .category-pill {
      width:max-content;
      min-height:28px;
      border:1px solid var(--line);
      border-radius:999px;
      background:var(--surface-soft);
      color:var(--primary);
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:0 13px;
      font-size:10px;
      line-height:1;
      font-weight:850;
      text-transform:uppercase;
    }
    .category-pill::before {
      content:"";
      width:8px;
      height:8px;
      border-radius:999px;
      background:#10b981;
      box-shadow:0 0 0 4px rgba(16,185,129,.12);
    }
    .signin-card h1 {
      margin:0;
      color:var(--ink);
      font-size:30px;
      line-height:1.14;
      font-weight:800;
      max-width:18em;
    }
    .signin-card p {
      margin:0;
      color:var(--muted);
      font-size:13px;
      line-height:1.55;
      max-width:58em;
      font-weight:550;
    }
    .fact-grid {
      display:grid;
      grid-template-columns:repeat(3, minmax(0, 1fr));
      gap:10px;
      border:1px solid var(--line-soft);
      border-radius:14px;
      background:var(--surface-soft);
      padding:10px;
    }
    .fact {
      min-width:0;
      min-height:72px;
      display:grid;
      place-items:center;
      align-content:center;
      gap:7px;
      text-align:center;
    }
    .fact span:first-child {
      color:var(--faint);
      font-size:10px;
      font-weight:850;
      text-transform:uppercase;
    }
    .fact span:last-child {
      color:var(--ink);
      font-size:13px;
      font-weight:800;
      min-width:0;
    }
    .state-row {
      display:flex;
      align-items:center;
      justify-content:center;
      gap:5px;
      flex-wrap:wrap;
    }
    .state-chip {
      min-width:54px;
      min-height:22px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      border:1px solid var(--line-soft);
      border-radius:999px;
      font-size:8px;
      font-weight:850;
      line-height:1;
    }
    .state-chip.Bullish { color:var(--success); background:var(--success-soft); }
    .state-chip.Neutral { color:var(--muted); background:#edf1f6; }
    .state-chip.Bearish { color:var(--danger); background:var(--danger-soft); }
    details.reading-guide {
      border:1px solid var(--line-soft);
      border-radius:14px;
      background:var(--surface);
      padding:12px;
    }
    details.reading-guide summary {
      cursor:pointer;
      color:var(--ink);
      font-size:12px;
      font-weight:800;
    }
    .guide-grid {
      display:grid;
      gap:8px;
      margin-top:10px;
      color:var(--muted);
      font-size:11.5px;
      line-height:1.45;
    }
    .guide-grid strong { color:var(--ink); }
    .signin-action {
      width:min(420px, 100%);
      display:grid;
      gap:9px;
      justify-items:center;
    }
    .signin-button {
      width:100%;
      min-height:52px;
      display:flex;
      align-items:center;
      justify-content:center;
      gap:12px;
      border:1px solid #cbd5e1;
      border-radius:13px;
      background:#fff;
      color:var(--ink);
      text-decoration:none;
      font-size:14px;
      font-weight:800;
      cursor:pointer;
      box-shadow:var(--shadow);
    }
    .signin-button:hover,
    .signin-button:focus-visible {
      border-color:#94a3b8;
      outline:0;
      box-shadow:var(--shadow-hover);
    }
    .signin-button:disabled {
      cursor:not-allowed;
      opacity:.62;
    }
    .google-icon {
      width:20px;
      height:20px;
      flex:0 0 auto;
    }
    .signin-message,
    .signin-helper {
      margin:0;
      color:var(--faint);
      font-size:11px;
      line-height:1.4;
      text-align:center;
      font-weight:650;
    }
    .waitlist-backdrop {
      position:fixed;
      inset:0;
      z-index:20;
      display:flex;
      align-items:flex-end;
      justify-content:center;
      background:rgba(15,23,42,.18);
      animation:waitlistFade .18s ease both;
    }
    .waitlist-sheet {
      width:min(680px, 100%);
      min-height:35vh;
      max-height:40vh;
      margin:0 14px 14px;
      border:1px solid var(--line);
      border-radius:22px;
      background:rgba(255,255,255,.98);
      box-shadow:0 -18px 54px -20px rgba(15,23,42,.34), 0 12px 34px rgba(15,23,42,.10);
      padding:24px;
      display:flex;
      flex-direction:column;
      gap:12px;
      animation:waitlistUp .24s cubic-bezier(.2,.8,.2,1) both;
    }
    .waitlist-heading {
      display:flex;
      align-items:center;
      gap:10px;
    }
    .waitlist-icon {
      width:28px;
      height:28px;
      border-radius:999px;
      display:grid;
      place-items:center;
      color:var(--success);
      background:var(--success-soft);
      border:1px solid rgba(0,113,77,.18);
      font-size:15px;
      font-weight:900;
    }
    .waitlist-sheet h2 {
      margin:0;
      color:var(--primary);
      font-size:20px;
      line-height:1.2;
      font-weight:500;
    }
    .waitlist-sheet p {
      margin:0;
      color:var(--muted);
      font-size:12.5px;
      line-height:1.48;
      font-weight:550;
    }
    .waitlist-sheet strong { color:var(--ink); }
    .waitlist-actions {
      margin-top:auto;
      display:flex;
      justify-content:flex-end;
    }
    .waitlist-got-it {
      min-height:38px;
      border:1px solid #cbd5e1;
      border-radius:999px;
      padding:0 18px;
      background:#fff;
      color:var(--ink);
      font:inherit;
      font-size:12px;
      font-weight:800;
      cursor:pointer;
    }
    @keyframes waitlistFade { from { opacity:0; } to { opacity:1; } }
    @keyframes waitlistUp { from { opacity:0; transform:translateY(42px); } to { opacity:1; transform:translateY(0); } }
    @media (max-width: 640px) {
      body { padding:16px; place-items:start center; padding-top:9vh; }
      .signin-shell { justify-items:start; }
      .signin-brand { justify-content:flex-start; }
      .brand-copy strong { font-size:23px; }
      .signin-card { padding:22px; border-radius:16px; }
      .signin-card h1 { font-size:23px; }
      .signin-card p { font-size:12px; }
      .fact-grid { grid-template-columns:1fr; gap:7px; }
      .fact { min-height:58px; }
      .signin-action { width:100%; }
      .waitlist-sheet {
        min-height:36vh;
        max-height:40vh;
        margin:0;
        border-radius:22px 22px 0 0;
        padding:22px 20px calc(22px + env(safe-area-inset-bottom));
      }
      .waitlist-actions { justify-content:stretch; }
      .waitlist-got-it { width:100%; min-height:42px; }
    }
