  /* Reset and Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
a {
            color: #60a5fa;
        }
        a:hover {
            text-decoration: underline;
        }

        body {
            margin: 0;
            font-family: Arial, Helvetica, sans-serif;
            background-color: #0f172a;
            color: #e2e8f0;
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
        }

        .banner {
            width: 100%;
            max-width: 1200px;
            margin-top: 20px;
        }

        .banner img {
            width: 100%;
            height: auto;
        }

        .container {
            max-width: 600px;
            margin-top: 40px;
        }

        h1 {
            font-size: 48px;
            margin-bottom: 10px;
        }

        p {
            font-size: 18px;
            color: #94a3b8;
        }

        .domain {
            margin-top: 20px;
            font-size: 14px;
            color: #64748b;
        }
:root{
    --bg:#0f172a;
    --panel:#111827;
    --panel2:#1f2937;
    --text:#e5e7eb;
    --muted:#94a3b8;
    --accent:#38bdf8;
    --border:#334155;
    --soft:#0b1220;
  }
.navbar {
    width: 100%;
    background-color: #020617;
    border-bottom: 1px solid #1e293b;
    display: flex;
    justify-content: center;
}

.navbar ul {
    list-style: none;
    margin: 0;
    padding: 10px 0;
    display: flex;
    gap: 40px;
}

.navbar li {
    display: inline;
}

.navbar a {
    text-decoration: none;
    color: #e2e8f0;
    font-size: 16px;
    font-weight: 500;
}

.navbar a:hover {
    color: #60a5fa;
}
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{
    margin:0;
    font-family:Inter, Segoe UI, Arial, Helvetica, sans-serif;
    background:linear-gradient(180deg,#0b1220 0%, #111827 100%);
    color:var(--text);
    line-height:1.6;
  }
  .wrap{
    max-width:1200px;
    margin:0 auto;
    padding:32px 20px 60px;
  }
  header{
    background:rgba(15,23,42,.75);
    border:1px solid var(--border);
    border-radius:20px;
    padding:28px;
    margin-bottom:24px;
    box-shadow:0 10px 30px rgba(0,0,0,.25);
  }
  h1,h2,h3{line-height:1.2;margin:0 0 12px}
  h1{font-size:2.2rem}
  h2{
    font-size:1.45rem;
    margin-top:10px;
    color:#f8fafc;
  }
  h3{
    font-size:1.1rem;
    color:#dbeafe;
    margin-top:18px;
  }
  p{margin:8px 0 14px}
  .lead{font-size:1.05rem;color:#dbeafe}
  .muted{color:var(--muted)}
  .grid{
    display:grid;
    grid-template-columns:280px 1fr;
    gap:24px;
  }
  nav{
    position:sticky;
    top:20px;
    align-self:start;
    background:rgba(15,23,42,.75);
    border:1px solid var(--border);
    border-radius:18px;
    padding:18px;
  }
  nav h2{font-size:1rem;margin-bottom:10px}
  nav a{
    display:block;
    color:#cbd5e1;
    text-decoration:none;
    padding:7px 0;
    border-bottom:1px solid rgba(148,163,184,.12);
  }
  nav a:last-child{border-bottom:none}
  nav a:hover{color:white}
  .content section{
    background:rgba(15,23,42,.72);
    border:1px solid var(--border);
    border-radius:20px;
    padding:24px;
    margin-bottom:22px;
    box-shadow:0 8px 22px rgba(0,0,0,.18);
  }
  table{
    width:100%;
    border-collapse:collapse;
    margin:12px 0 6px;
    font-size:.97rem;
  }
  th, td{
    border:1px solid var(--border);
    padding:10px 12px;
    vertical-align:top;
  }
  th{
    text-align:left;
    background:#172033;
    color:#e2e8f0;
  }
  td{background:#0f172a}
  .formula{
    background:#0b1326;
    border:1px solid #23324d;
    border-left:4px solid var(--accent);
    border-radius:14px;
    padding:14px 16px;
    margin:12px 0 16px;
    font-size:1.02rem;
    overflow:auto;
  }
  .formula code{
    font-family:"Cambria Math","Times New Roman",serif;
    color:#f8fafc;
    font-size:1.06rem;
  }
  .note, .warn, .tip{
    border-radius:14px;
    padding:14px 16px;
    margin:14px 0;
  }
  .note{background:#0f1a2f;border:1px solid #27406a}
  .warn{background:#231817;border:1px solid #7f1d1d}
  .tip{background:#10231e;border:1px solid #175c48}
  ul{margin:8px 0 14px 22px}
  li{margin:6px 0}
  .chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
  .chip{
    display:inline-block;
    border:1px solid var(--border);
    background:#0b1326;
    color:#dbeafe;
    padding:7px 10px;
    border-radius:999px;
    font-size:.92rem;
  }
  .small{font-size:.92rem}
  footer{
    color:var(--muted);
    text-align:center;
    margin-top:30px;
    font-size:.92rem;
  }
  @media (max-width: 920px){
    .grid{grid-template-columns:1fr}
    nav{position:static}
  }