:root{
  --ig-yellow:#FEDC00;
  --ig-bg:#0B0D10;
  --ig-surface:#11141A;
  --ig-text:#F6F6F6;
  --ig-muted:rgba(246,246,246,.7);
  --ig-border:rgba(255,255,255,.08);
  --radius:20px;
}

/* Reset */
*{
  box-sizing:border-box;
  margin:0;
  padding:0;
}

html, body{
  height:100%;
}

body{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  background:
    radial-gradient(1200px 600px at 20% -10%, rgba(254,220,0,.06), transparent 50%),
    var(--ig-bg);
  color: var(--ig-text);
  display:flex;
  flex-direction:column;
}

/* Main */
main{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:40px 20px;
}

/* Error card */
.error-card{
  background: linear-gradient(180deg, rgba(255,255,255,.02), transparent), var(--ig-surface);
  padding:64px 56px;
  border-radius:var(--radius);
  text-align:center;
  max-width:720px;
  width:100%;
  border:1px solid var(--ig-border);
  box-shadow:0 30px 80px rgba(0,0,0,.55);
}

.error-code{
  font-size:80px;
  font-weight:800;
  letter-spacing:-2px;
  color:var(--ig-yellow);
  margin-bottom:12px;
}

h1{
  font-size:34px;
  font-weight:700;
  margin-bottom:22px;
}

p{
  font-size:18px;
  line-height:1.65;
  color:var(--ig-muted);
}

/* Request ID */
.request-id{
  margin-top:32px;
  font-size:14px;
  font-weight:500;
  color:var(--ig-yellow);
  background:rgba(254,220,0,.1);
  padding:10px 16px;
  border-radius:10px;
  display:inline-block;
}

/* Footer */
footer{
  padding:24px;
  text-align:center;
  font-size:13px;
  color:var(--ig-muted);
}