:root {
  color-scheme: dark;
  font-family: Arial, "Noto Sans Hebrew", "Segoe UI", sans-serif;
  background: #0b1724;
  color: #f5f8f7;
}

* { box-sizing: border-box; }

body { margin: 0; min-width: 320px; }

.page-shell {
  position: relative;
  display: grid;
  min-height: 100svh;
  overflow: hidden;
  place-items: center;
  padding: clamp(24px, 5vw, 72px);
  background: radial-gradient(circle at 16% 12%, #1a3e4c 0, transparent 35%),
    radial-gradient(circle at 86% 86%, #123648 0, transparent 34%),
    #0b1724;
}

.ambient {
  position: absolute;
  width: min(45vw, 540px);
  aspect-ratio: 1;
  border: 1px solid rgb(123 224 195 / 10%);
  border-radius: 50%;
  pointer-events: none;
}

.ambient-one { top: -24%; left: -12%; }
.ambient-two { right: -18%; bottom: -36%; width: min(58vw, 720px); }

.notice {
  position: relative;
  width: min(100%, 760px);
  min-height: 510px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: clamp(30px, 5vw, 64px);
  border: 1px solid rgb(204 239 228 / 15%);
  border-radius: 28px;
  background: linear-gradient(145deg, rgb(24 51 62 / 96%), rgb(13 30 44 / 98%));
  box-shadow: 0 28px 100px rgb(0 0 0 / 28%);
}

.brand {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 23px;
  font-weight: 700;
  letter-spacing: -0.04em;
}

.brand-mark { width: 48px; height: 48px; border-radius: 13px; }

.message { max-width: 590px; padding-block: 64px 52px; }

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 24px;
  padding: 9px 14px;
  border: 1px solid rgb(127 225 190 / 25%);
  border-radius: 100px;
  color: #a8e6d1;
  background: rgb(99 209 171 / 8%);
  font-size: 14px;
  font-weight: 600;
}

.status-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #7de0b7;
  box-shadow: 0 0 0 4px rgb(125 224 183 / 12%);
}

h1 {
  margin: 0;
  font-size: clamp(38px, 6vw, 64px);
  line-height: 1.14;
  letter-spacing: -0.055em;
}

.description {
  max-width: 530px;
  margin: 24px 0 0;
  color: #c2d4d4;
  font-size: clamp(18px, 2.2vw, 21px);
  line-height: 1.75;
}

.closing {
  margin: 20px 0 0;
  color: #91aaa9;
  font-size: 15px;
  line-height: 1.7;
}

.notice-footer {
  display: flex;
  align-items: center;
  gap: 16px;
  color: #819c9c;
  direction: ltr;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
}

.footer-line { width: 48px; height: 1px; background: #466b6c; }

@media (max-width: 600px) {
  .page-shell { padding: 18px; }
  .notice { min-height: min(590px, calc(100svh - 36px)); border-radius: 22px; }
  .message { padding-block: 74px 64px; }
  .description { margin-top: 20px; }
  .ambient-one { width: 80vw; }
  .ambient-two { width: 100vw; }
}
