:root{
      --bg:#0b0f14;
      --fg:#f5f7fb;
      --muted:#b7c0d1;
      --accent:#3b82f6;
      --accent-2:#60a5fa;
      --card:#10151d;
    }

    body{
      margin:0;
      font: 400 16px/1.6 system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, "Noto Sans";
      color:var(--fg);
      background:radial-gradient(1200px 800px at 20% -10%, #0f1824 0%, var(--bg) 70%);
    }

    h1{
      font-weight:800;
      letter-spacing:0.4px;
      font-size: clamp(26px, 3.6vw, 40px);
      background: linear-gradient(90deg, #3b82f6, #60a5fa, #3b82f6);
      background-size: 200% auto;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;

      animation: shine 6s linear infinite;

    }

    @keyframes shine {
      to { background-position: 200% center; }
    }

    .subtitle{ color:var(--muted); font-size:0.95rem }

    .logo{
      background:var(--card);
      border:1px solid rgba(255,255,255,.08);
      padding:14px 16px;
      border-radius:18px;
      display:grid;
      place-items:center;
      box-shadow: 0 8px 24px rgba(0,0,0,.28);
      transition:transform .25s ease;
    }
    .logo:hover{ transform:scale(1.05); }
    .logo img{ max-height:64px; width:auto; filter: drop-shadow(0 2px 8px rgba(0,0,0,.35));}

    .description{
      background:rgba(255,255,255,.02);
      border:1px solid rgba(255,255,255,.08);
      padding:20px;
      border-radius:14px;
      margin:24px 0;
      line-height:1.7;
      font-size:1rem;
      box-shadow: 0 6px 20px rgba(0,0,0,.25);
    }

    .card-custom{
      background:var(--card);
      border:1px solid rgba(255,255,255,.08);
      border-radius:16px;
      overflow:hidden;
      box-shadow: 0 6px 20px rgba(0,0,0,.25);
      transition: transform .25s ease, box-shadow .25s ease;
    }
    .card-custom:hover{
      transform:scale(1.04);
      box-shadow:0 10px 28px rgba(59,130,246,.4);
    }
    .thumb{ display:block; width:100%; aspect-ratio: 1/1; object-fit:cover; }

    footer{ color:var(--muted); text-align:center; margin:28px 0 10px; font-size:0.9rem }

     #modalImage {
    max-width: 90%;
    max-height: 80vh;
    object-fit: contain;
  }