:root{
  --bg0:#070b14;
  --bg1:#0b1220;      /* deep navy */
  --bg2:#0f1a2d;      /* surface */
  --bg3:#13223a;      /* surface alt */
  --line:rgba(192,192,192,.22); /* silver */
  --text:#f8fafc;     /* white */
  --muted:#b8c2d6;

  --gold:#fbbf24;
  --amber:#f59e0b;
  --orange:#f97316;

  --glow: rgba(251,191,36,.18);
  --shadow: 0 18px 60px rgba(0,0,0,.55);
}

html,body{
  height:100%;
  background: radial-gradient(1200px 700px at 25% 10%, rgba(251,191,36,.06), transparent 55%),
              radial-gradient(900px 600px at 80% 15%, rgba(249,115,22,.05), transparent 60%),
              linear-gradient(180deg, var(--bg0), var(--bg1));
  color: var(--text);
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}

::selection{ background: rgba(251,191,36,.22); }

.oly-card{
  background: linear-gradient(180deg, rgba(19,34,58,.70), rgba(15,26,45,.78));
  border: 1px solid var(--line);
  border-radius: 18px;
  box-shadow: var(--shadow);
}

.oly-panel{
  background: rgba(15,26,45,.70);
  border: 1px solid var(--line);
  border-radius: 16px;
}

.oly-input{
  background: rgba(7,11,20,.55);
  border: 1px solid rgba(192,192,192,.18);
  border-radius: 12px;
  color: var(--text);
  outline: none;
}
.oly-input:focus{
  border-color: rgba(251,191,36,.55);
  box-shadow: 0 0 0 4px rgba(251,191,36,.14);
}

.oly-btn{
  border-radius: 14px;
  border: 1px solid rgba(251,191,36,.35);
  background: linear-gradient(180deg, rgba(251,191,36,.18), rgba(245,158,11,.10));
  box-shadow: 0 10px 26px rgba(0,0,0,.35);
}
.oly-btn:hover{ transform: translateY(-1px); }
.oly-btn:active{ transform: translateY(0px); }

.oly-chip{
  border-radius: 999px;
  border: 1px solid rgba(192,192,192,.20);
  background: rgba(7,11,20,.45);
}

.oly-code{
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 12px;
}