:root {
  color-scheme: light;
  --win-face: #d4d0c8;
  --win-blue: #0a246a;
  --win-shadow: #808080;
  --win-dark: #404040;
  --win-light: #fff;
}

* { box-sizing: border-box; }
html, body { min-height: 100%; }

body[data-style="windows-2000-mirc"] {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  overflow-x: hidden;
  color: #000;
  background: #3a6ea5;
  font: 12px/1.45 Tahoma, Verdana, sans-serif;
}

.skip-link {
  position: fixed;
  top: 4px;
  left: -999px;
  z-index: 100;
  padding: 5px 9px;
  color: #000;
  background: #fff;
  border: 2px solid #000;
}

.skip-link:focus { left: 4px; }

.mp-legal-desktop {
  min-height: 100vh;
  display: grid;
  place-items: start center;
  padding: 28px 18px;
}

.mp-legal-window {
  width: min(820px, 100%);
  background: var(--win-face);
  border: 2px solid;
  border-color: var(--win-light) var(--win-dark) var(--win-dark) var(--win-light);
  box-shadow: 2px 2px 0 rgb(0 0 0 / 35%);
}

.mp-legal-titlebar {
  min-height: 24px;
  padding: 3px 3px 3px 6px;
  color: #fff;
  background: linear-gradient(90deg, var(--win-blue), #2f89c8);
}

.mp-legal-titlebar strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mp-legal-titlebar .win2k-window-close {
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  margin: 0;
  padding: 0;
  color: #000;
  background: #d4d0c8;
  border: 0;
  border-radius: 0;
  box-shadow: inset -1px -1px #000, inset 1px 1px #fff, inset -2px -2px #808080;
  font: 700 12px/1 Tahoma, Verdana, sans-serif;
  text-shadow: none;
}

.mp-legal-titlebar .win2k-window-close:active {
  box-shadow: inset 1px 1px #000, inset -1px -1px #fff, inset 2px 2px #808080;
  padding: 1px 0 0 1px;
}

.mp-legal-titlebar .win2k-window-close:focus-visible {
  outline: 1px dotted #000;
  outline-offset: -4px;
}

.mp-legal-menubar {
  display: flex;
  gap: 2px;
  min-height: 27px;
  padding: 2px 5px;
  border-bottom: 1px solid var(--win-shadow);
}

.mp-legal-menubar a {
  padding: 3px 7px;
  color: #000;
  text-decoration: none;
  border: 1px solid transparent;
}

.mp-legal-menubar a:hover,
.mp-legal-menubar a:focus-visible {
  color: #fff;
  background: var(--win-blue);
  outline: none;
}

.mp-legal-document {
  margin: 10px;
  padding: clamp(18px, 4vw, 40px);
  background: #fff;
  border: 2px solid;
  border-color: var(--win-shadow) var(--win-light) var(--win-light) var(--win-shadow);
}

.mp-legal-version {
  margin: 0 0 4px;
  color: #555;
  font-weight: 700;
  text-transform: uppercase;
}

.mp-legal-document h1 {
  margin: 0 0 18px;
  color: var(--win-blue);
  font-size: clamp(22px, 4vw, 32px);
}

.mp-legal-document h2 {
  margin: 26px 0 7px;
  padding-bottom: 4px;
  color: #111;
  border-bottom: 1px solid #aaa;
  font-size: 16px;
}

.mp-legal-document p {
  max-width: 72ch;
  margin: 0 0 12px;
  font-size: 14px;
}

.mp-legal-intro {
  padding: 10px 12px;
  background: #ffffe1;
  border: 1px solid #808080;
  font-weight: 700;
}

.mp-legal-statusbar {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 3px;
  padding: 3px;
  border-top: 1px solid var(--win-shadow);
}

.mp-legal-statusbar span {
  min-height: 20px;
  padding: 2px 5px;
  border: 1px solid;
  border-color: var(--win-shadow) var(--win-light) var(--win-light) var(--win-shadow);
}

@media (max-width: 620px) {
  .mp-legal-desktop { padding: 8px; }
  .mp-legal-menubar { flex-wrap: wrap; }
  .mp-legal-document { margin: 7px; padding: 18px 14px; }
  .mp-legal-statusbar { grid-template-columns: 1fr; }
  .mp-legal-statusbar span:last-child { display: none; }
}
