/* =========================
       Theme Tokens
    ========================= */
    :root{
      --bg: #f4f7f6;
      --panel: #ffffff;
      --text-main: #111;
      --text-sub: #555;

      --btn-bg: #ffffff;
      --btn-text: #111;
      --btn-border: #cfd6dd;

      --border: #d7dbe0;
    }

    [data-theme="dark"]{
      --bg: #121212;
      --panel: #1e1e1e;
      --text-main: #ffffff;
      --text-sub: #aaa;

      --btn-bg: #2a2a2a;
      --btn-text: #ffffff;
      --btn-border: #444;

      --border: #333;
    }

    /* =========================
       Base
    ========================= */
    body{
      margin:0;
      padding:0;
      font-family: Pretendard, system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
      background: var(--bg);
      color: var(--text-main);
      transition: background 0.2s ease, color 0.2s ease;
    }

    .wrap{
      min-height:100vh;
      display:flex;
      justify-content:center;
      align-items:center;
      padding: 18px;
      box-sizing: border-box;
    }

    .panel{
      background: var(--panel);
      border: 1px solid var(--border);
      border-radius: 18px;
      padding: 28px 32px;
      width: 100%;
      max-width: 580px;
      box-shadow: 0 10px 30px rgba(0,0,0,0.06);
    }

    header{
      display:flex;
      justify-content:space-between;
      align-items:flex-start;
      gap: 14px;
      margin-bottom: 18px;
    }

    .brand{
      display:flex;
      flex-direction:column;
      gap: 6px;
      min-width: 0;
    }

    h1{
      margin:0;
      font-size: 22px;
      font-weight: 950;
      letter-spacing: -0.2px;
      line-height: 1.1;
    }

    .subtitle{
      font-size: 13px;
      color: var(--text-sub);
      line-height: 1.55;
    }

    .theme-toggle{
      background: var(--btn-bg);
      color: var(--btn-text);
      border: 1px solid var(--btn-border);
      border-radius: 10px;
      padding: 6px 10px;
      cursor: pointer;
      font-weight: 850;
      transition: 0.15s;
      white-space: nowrap;
      flex: 0 0 auto;
    }

    .theme-toggle:hover{
      filter: brightness(1.05);
    }

    /* =========================
       Buttons
    ========================= */
    .quick-links{
      display:flex;
      flex-direction:column;
      gap:14px;
      margin-top: 18px;
    }

    .quick-btn{
      display:flex;
      align-items:center;
      justify-content:center;
      gap:8px;

      padding: 14px 18px;
      border-radius: 999px;

      font-size: 15px;
      font-weight: 900;
      text-decoration:none;

      background: var(--btn-bg);
      color: var(--btn-text);
      border: 1px solid var(--btn-border);

      transition: all 0.15s ease;
    }

    .quick-btn:hover{
      transform: translateY(-2px);
      filter: brightness(1.05);
    }

    /* Link accents (optional) */
    .quick-btn.screener{ border-color: #6f8fd6; }
    .quick-btn.strategy{ border-color: #ffb703; }
    .quick-btn.theme{ border-color: #9b5de5; }

    /* =========================
       Footer & Disclaimer
    ========================= */
    footer{
      margin-top: 24px;
      padding-top: 16px;
      border-top: 1px solid var(--border);
      font-size: 12px;
      color: var(--text-sub);
      line-height: 1.6;
    }

    .meta-line{
      display:flex;
      gap: 8px;
      flex-wrap: wrap;
      align-items:center;
    }

    .tag{
      display:inline-flex;
      align-items:center;
      gap:6px;
      padding: 3px 8px;
      border-radius: 999px;
      border: 1px solid var(--btn-border);
      background: rgba(127,127,127,0.06);
      font-size: 11px;
      color: var(--text-sub);
    }

    .disclaimer{
      margin-top: 10px;
      font-size: 11.5px;
      color: var(--text-sub);
      opacity: 0.95;
    }