:root{
    --bg:#f6f7f9;
    --card:#fff;
    --text:#0f172a;
    --muted:#64748b;
    --line:#e5e7eb;
    --btn:#111;
    --btnText:#fff;
    --accent:#2563eb;
  }
  
  *{ box-sizing:border-box; }
  body{
    margin:0;
    font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
    background:var(--bg);
    color:var(--text);
  }
  a{ color:var(--accent); text-decoration:none; }
  a:hover{ text-decoration:underline; }
  
  .wrap{ max-width:720px; margin:0 auto; padding:16px; }
  .card{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:14px;
    padding:14px;
    box-shadow: 0 1px 10px rgba(15,23,42,0.06);
  }
  h1,h2,h3{ margin:0 0 10px; }
  .muted{ color:var(--muted); font-size:14px; }
  
  .row{ display:flex; gap:10px; flex-wrap:wrap; }
  .field{ display:flex; flex-direction:column; gap:6px; margin:10px 0; }
  input{
    padding:10px 12px;
    border:1px solid var(--line);
    border-radius:10px;
    font-size:16px;
    width:100%;
  }
  button,.btn{
    background:var(--btn);
    color:var(--btnText);
    border:0;
    padding:10px 14px;
    border-radius:10px;
    cursor:pointer;
    font-weight:600;
    width: 100%;
  }
  button:hover,.btn:hover{ filter:brightness(0.95); }
  .btn.secondary{ background:#fff; color:#111; border:1px solid var(--line); }
  
  .topbar{
    display:flex; align-items:center; justify-content:space-between;
    gap:10px; margin-bottom:12px;
  }
  .pill{ background:#eef2ff; color:#1e40af; padding:4px 10px; border-radius:999px; font-size:13px; }
  
  .list{ margin:0; padding-left:18px; }
  .hr{ height:1px; background:var(--line); margin:12px 0; }

  /* Mobile-friendly topbar */
.topbar{
    flex-wrap: wrap;
    align-items: center;
  }
  
  .topbar .nav{
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
  }
  
  @media (max-width: 520px){
    .topbar .nav{
      width: 100%;
      justify-content: flex-start; /* nicer on phone */
    }
    .topbar .nav .btn{
      padding: 8px 10px;
      border-radius: 12px;
      font-size: 14px;
    }
  }