:root {
  color-scheme: light;
}

* {
  -webkit-tap-highlight-color: transparent;
}

body {
  min-height: 100vh;
  background:
    radial-gradient(circle at top left, rgba(20, 184, 166, 0.18), transparent 32rem),
    linear-gradient(135deg, #f8fafc 0%, #eef2ff 48%, #ecfeff 100%);
}

.glass-surface {
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(148, 163, 184, 0.22);
  box-shadow: 0 20px 60px rgba(15, 23, 42, 0.08);
  backdrop-filter: blur(18px);
}

.host-card {
  transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.host-card:active {
  transform: scale(0.985);
}

@media (hover: hover) {
  .host-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 38px rgba(15, 23, 42, 0.1);
  }
}