:root { color-scheme: dark; }
* { box-sizing: border-box; }
html, body { margin: 0; min-width: 280px; background: #000; color: #f5f5f5; }
body { font-family: 'Noto Sans', Arial, sans-serif; }
main {
  display: grid;
  place-items: center;
  min-height: 100vh;
  min-height: 100svh;
  padding: 32px max(24px, env(safe-area-inset-right)) 32px max(24px, env(safe-area-inset-left));
}
.entry { display: flex; flex-direction: column; align-items: center; gap: 36px; max-width: 100%; text-align: center; }
h1 { margin: 0; font-size: clamp(52px, 12vw, 72px); line-height: 1.1; font-weight: 700; }
.open-web {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  max-width: 100%;
  padding: 12px 26px;
  border-radius: 26px;
  background: #e2e5e7;
  color: #111;
  font-size: 17px;
  line-height: 24px;
  font-weight: 600;
  text-decoration: none;
  transition: background-color 140ms ease;
}
.open-web:focus-visible { outline: 2px solid #92979b; outline-offset: 5px; }
@media (hover: hover) { .open-web:hover { background: #f5f5f5; } }
.open-web:active { background: #c0c3c5; }
@media (prefers-reduced-motion: reduce) { .open-web { transition: none; } }