<style>
  /* =========================
   Global Dark Blue Theme
   ========================= */

:root {
  --bg: #0f141c;
  --bg-panel: #151c27;
  --bg-panel-2: #1a2230;
  --border: rgba(255, 255, 255, 0.06);
  --text: #e6ebf2;
  --text-muted: #a9b2c2;
  --accent: #4ea1ff;
  --shadow: rgba(0, 0, 0, 0.45);
  --radius: 20px;
}

html, body {
    color: #f2f6fc;
  text-align: center;
  background: linear-gradient(180deg, #0e1320 0%, #0f141c 100%);
  background-attachment: fixed;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

/* =========================
   Panels / Containers
   ========================= */

div {
  padding-bottom: 20px;
  background-color: var(--bg-panel);
  border-radius: var(--radius);
  box-shadow:
    0 8px 24px var(--shadow),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

/* Slight contrast for nested divs */
div div {
  background-color: var(--bg-panel-2);
}

/* =========================
   Text
   ========================= */

h1, h2, h3, h4, h5, h6 {
  color: #f2f6fc;
}

p, span, li {
  color: var(--text);
}

small, .muted {
  color: var(--text-muted);
}

/* =========================
   Links
   ========================= */

a {
  color: var(--accent);
  text-decoration: none;
    display: inline;
  width: auto;
  height: auto;
  padding: 0;
  margin: 0;
}

button{
  color: color: var(--accent);
}

/* =========================
   Images
   ========================= */

img {
  border-radius: var(--radius);
  box-shadow: 0 6px 20px var(--shadow);
  max-width: 100%;
  height: auto;
}

/* Inline icon images */
.icon {
  display: inline-block;
  height: 1em;
  width: 1em;
  margin-right: 0.4em;
  vertical-align: -0.15em;
  box-shadow: none;
  border-radius: 4px;
}

/* =========================
   Buttons & Inputs
   ========================= */

button,
input,
select,
textarea {
  background: var(--bg-panel-2);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 0.5em 0.75em;
}

button:hover {
  background: #1f2a3d;
}

/* =========================
   Utility
   ========================= */

.card {
  padding: 1rem;
}

.shadow {
  box-shadow: 0 10px 30px var(--shadow);
}

  </style>
