/* The dialogs before a system starts (license, then notice, then memory; emulator.js) in the
   style of the launcher layout on show. They follow #launcher in the page, so its
   oss-layout-* class reaches them here. Current grid keeps the site's own look from
   emulator.css. Every layout keeps its fit: safe-area insets, dvh heights, and a body
   that scrolls while the title and buttons stay in view. */

#launcher:not(.oss-layout-grid) ~ :is(#license-agreement, #system-notice, #memory-warning)[open] { display: flex; flex-direction: column; }
#launcher:not(.oss-layout-grid) ~ :is(#license-agreement, #system-notice, #memory-warning) :is(#license-agreement-text, #system-notice-text, .memory-warning-text) {
  min-height: 0; overflow-y: auto; overscroll-behavior: contain;
}
#launcher:not(.oss-layout-grid) ~ :is(#license-agreement, #system-notice, #memory-warning) :is(h2, .dialog-actions, .system-notice-never) { flex: none; }

/* ---- Mobile Mode: a bottom sheet, buttons full width and stacked. No animation. ---- */

#launcher.oss-layout-mobile ~ :is(#license-agreement, #system-notice, #memory-warning) {
  --dialog-theme: mobile;
  inset: env(safe-area-inset-top, 0px) 0 0 0; margin: auto auto 0; width: 100%; max-width: 480px;
  max-height: calc(100vh - 24px - env(safe-area-inset-top, 0px));
  max-height: calc(100dvh - 24px - env(safe-area-inset-top, 0px));
  padding: 8px max(20px, env(safe-area-inset-right, 0px)) calc(16px + env(safe-area-inset-bottom, 0px)) max(20px, env(safe-area-inset-left, 0px));
  border: 0; border-radius: 20px 20px 0 0; background: #f4f4f7; color: #1c1c1e;
  box-shadow: 0 -8px 30px rgba(0, 0, 0, 0.32);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
#launcher.oss-layout-mobile ~ :is(#license-agreement, #system-notice, #memory-warning)::before {
  content: ""; flex: none; display: block; width: 36px; height: 5px; margin: 0 auto 14px; border-radius: 3px; background: #b9b9c1;
}
#launcher.oss-layout-mobile ~ :is(#license-agreement, #system-notice, #memory-warning)::backdrop { background: rgba(0, 0, 0, 0.42); }
#launcher.oss-layout-mobile ~ :is(#license-agreement, #system-notice, #memory-warning) h2 { font-size: 1.2rem; font-weight: 700; text-align: center; color: #1c1c1e; }
#launcher.oss-layout-mobile ~ #memory-warning h2 { color: #a64600; }
#launcher.oss-layout-mobile ~ :is(#license-agreement, #system-notice, #memory-warning) p { font-size: 15px; color: #3a3a3c; }
#launcher.oss-layout-mobile ~ #license-agreement .license-agreement-name { color: #1c1c1e; }
#launcher.oss-layout-mobile ~ #license-agreement a { color: #0050c0; }
#launcher.oss-layout-mobile ~ #system-notice .system-notice-never { color: #3a3a3c; font-size: 15px; }
#launcher.oss-layout-mobile ~ #system-notice .system-notice-never input { accent-color: #0060df; }
#launcher.oss-layout-mobile ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions { flex-direction: column-reverse; align-items: stretch; gap: 8px; margin-top: 4px; }
#launcher.oss-layout-mobile ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button {
  width: 100%; min-height: 50px; padding: 12px 16px; border: 0; border-radius: 14px;
  background: #e2e2e8; color: #1c1c1e; font-size: 17px; font-weight: 600;
}
#launcher.oss-layout-mobile ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button:hover { background: #d6d6de; }
#launcher.oss-layout-mobile ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions .primary { background: #0060df; color: #fff; }
#launcher.oss-layout-mobile ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions .primary:hover { background: #0054c4; }
#launcher.oss-layout-mobile ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button:focus-visible { outline: 3px solid #0060df; outline-offset: 2px; }

/* ---- Cover Flow: an attached sheet from the top edge, pinstriped, with a glossy default button ---- */

#launcher.oss-layout-coverflow ~ :is(#license-agreement, #system-notice, #memory-warning) {
  --dialog-theme: coverflow;
  margin: 0 auto auto; max-width: 540px; padding: 18px 22px 16px;
  border: 1px solid #6e6e6e; border-top: 0; border-radius: 0 0 10px 10px;
  background: repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.5) 0 2px, rgba(0, 0, 0, 0.022) 2px 4px), linear-gradient(#f3f3f3, #e3e3e3);
  background-color: #e8e8e8; color: #1a1a1a;
  box-shadow: inset 0 7px 7px -7px rgba(0, 0, 0, 0.45), 0 14px 36px rgba(0, 0, 0, 0.6);
  font-family: "Lucida Grande", "Helvetica Neue", Helvetica, Arial, sans-serif;
  transition: transform 0.34s cubic-bezier(0.2, 0.8, 0.2, 1), overlay 0.34s allow-discrete, display 0.34s allow-discrete;
}
#launcher.oss-layout-coverflow ~ :is(#license-agreement, #system-notice, #memory-warning):not([open]) { transform: translateY(-105%); }
@starting-style {
  #launcher.oss-layout-coverflow ~ :is(#license-agreement, #system-notice, #memory-warning)[open] { transform: translateY(-105%); }
}
#launcher.oss-layout-coverflow ~ :is(#license-agreement, #system-notice, #memory-warning)::backdrop {
  background: rgba(0, 0, 0, 0.38); transition: background-color 0.34s, overlay 0.34s allow-discrete, display 0.34s allow-discrete;
}
#launcher.oss-layout-coverflow ~ :is(#license-agreement, #system-notice, #memory-warning):not([open])::backdrop { background-color: transparent; }
@starting-style {
  #launcher.oss-layout-coverflow ~ :is(#license-agreement, #system-notice, #memory-warning)[open]::backdrop { background-color: transparent; }
}
#launcher.oss-layout-coverflow ~ :is(#license-agreement, #system-notice, #memory-warning) h2 { font-size: 14px; font-weight: 700; color: #111; }
#launcher.oss-layout-coverflow ~ #memory-warning h2 { color: #7f4b00; }
#launcher.oss-layout-coverflow ~ :is(#license-agreement, #system-notice, #memory-warning) p { font-size: 13px; line-height: 1.5; color: #222; }
#launcher.oss-layout-coverflow ~ #license-agreement .license-agreement-name { color: #000; }
#launcher.oss-layout-coverflow ~ #license-agreement a { color: #0b4fae; }
#launcher.oss-layout-coverflow ~ #system-notice .system-notice-never { color: #222; font-size: 13px; }
#launcher.oss-layout-coverflow ~ #system-notice .system-notice-never input { accent-color: #2f7fe0; }
#launcher.oss-layout-coverflow ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions { gap: 12px; }
#launcher.oss-layout-coverflow ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button {
  min-width: 86px; min-height: 26px; padding: 3px 18px; border: 1px solid #8a8a8a; border-radius: 13px;
  background: linear-gradient(#ffffff, #f2f2f2 45%, #dddddd 50%, #f5f5f5); background-color: #ececec;
  color: #111; font-size: 13px; font-weight: 400;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25), inset 0 1px 0 #fff;
}
#launcher.oss-layout-coverflow ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions .primary {
  border-color: #2a62b5; color: #00142b;
  background: linear-gradient(#e1f0ff, #94c9ff 45%, #4f9bef 50%, #86c2ff 90%, #b3daff); background-color: #79b6f5;
  animation: dlg-cf-throb 1.8s ease-in-out infinite;
}
@keyframes dlg-cf-throb { 50% { filter: brightness(1.13) saturate(1.15); } }
#launcher.oss-layout-coverflow ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button:hover { filter: brightness(0.96); }
#launcher.oss-layout-coverflow ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(80, 150, 240, 0.75); }
@media (pointer: coarse) {
  #launcher.oss-layout-coverflow ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button { min-height: 40px; border-radius: 20px; font-size: 15px; }
}

/* ---- Channels: a light system message with big pill buttons and rounded type ---- */

#launcher.oss-layout-channels ~ :is(#license-agreement, #system-notice, #memory-warning) {
  --dialog-theme: channels;
  max-width: 600px; padding: 26px 30px 24px; border: 3px solid #d3dbe2; border-radius: 28px;
  background: linear-gradient(#ffffff, #eef2f5); background-color: #f6f8fa; color: #3c4650; text-align: center;
  box-shadow: 0 20px 60px rgba(30, 60, 90, 0.35), inset 0 1px 0 #fff;
  font-family: ui-rounded, "Nunito", "Varela Round", "Segoe UI", system-ui, sans-serif;
  transition: transform 0.38s cubic-bezier(0.3, 1.35, 0.5, 1), opacity 0.25s, overlay 0.38s allow-discrete, display 0.38s allow-discrete;
}
#launcher.oss-layout-channels ~ :is(#license-agreement, #system-notice, #memory-warning):not([open]) { transform: scale(0.86); opacity: 0; }
@starting-style {
  #launcher.oss-layout-channels ~ :is(#license-agreement, #system-notice, #memory-warning)[open] { transform: scale(0.86); opacity: 0; }
}
#launcher.oss-layout-channels ~ :is(#license-agreement, #system-notice, #memory-warning)::backdrop {
  background: rgba(230, 236, 241, 0.82); transition: background-color 0.3s, overlay 0.38s allow-discrete, display 0.38s allow-discrete;
}
#launcher.oss-layout-channels ~ :is(#license-agreement, #system-notice, #memory-warning):not([open])::backdrop { background-color: transparent; }
@starting-style {
  #launcher.oss-layout-channels ~ :is(#license-agreement, #system-notice, #memory-warning)[open]::backdrop { background-color: transparent; }
}
#launcher.oss-layout-channels ~ :is(#license-agreement, #system-notice, #memory-warning) h2 {
  margin-bottom: 14px; font-family: "Arial Rounded MT Bold", ui-rounded, "Nunito", "Varela Round", "Segoe UI", system-ui, sans-serif;
  font-size: 1.55rem; font-weight: 700; color: #36414b;
}
#launcher.oss-layout-channels ~ #memory-warning h2 { color: #8a4f00; }
#launcher.oss-layout-channels ~ :is(#license-agreement, #system-notice, #memory-warning) p { font-size: 15px; color: #47525c; }
#launcher.oss-layout-channels ~ #license-agreement .license-agreement-name { color: #2f3a44; }
#launcher.oss-layout-channels ~ #license-agreement a { color: #11668b; }
#launcher.oss-layout-channels ~ #system-notice .system-notice-never { margin-left: auto; margin-right: auto; color: #47525c; font-size: 15px; }
#launcher.oss-layout-channels ~ #system-notice .system-notice-never input { accent-color: #1a9fd4; }
#launcher.oss-layout-channels ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions { justify-content: center; gap: 18px; margin-top: 6px; }
#launcher.oss-layout-channels ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button {
  min-width: 160px; padding: 13px 28px; border: 3px solid #c9d6df; border-radius: 999px;
  background: linear-gradient(#ffffff, #e8eef2); background-color: #f2f5f7; color: #48535d;
  font-family: "Arial Rounded MT Bold", ui-rounded, "Nunito", "Varela Round", "Segoe UI", system-ui, sans-serif; font-size: 1.1rem; font-weight: 700;
  box-shadow: 0 3px 10px rgba(40, 80, 120, 0.15); transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
}
#launcher.oss-layout-channels ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions .primary { color: #11668b; }
#launcher.oss-layout-channels ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button:is(:hover, :focus-visible) {
  outline: none; border-color: #34beed; transform: scale(1.04);
  box-shadow: 0 0 0 4px rgba(52, 190, 237, 0.3), 0 6px 18px rgba(40, 120, 160, 0.25);
}

/* ---- XMB: a band between thin rules over a dimmed screen, centered text, glowing options ---- */

#launcher.oss-layout-xmb ~ :is(#license-agreement, #system-notice, #memory-warning) {
  --dialog-theme: xmb;
  left: 0; right: 0; margin: auto 0; width: 100%; max-width: none;
  padding: 26px max(24px, env(safe-area-inset-right, 0px), calc((100% - 680px) / 2)) 22px max(24px, env(safe-area-inset-left, 0px), calc((100% - 680px) / 2));
  border: 0; border-block: 1px solid rgba(255, 255, 255, 0.78); border-radius: 0;
  background: linear-gradient(rgba(7, 16, 42, 0.84), rgba(7, 16, 42, 0.92)); background-color: rgba(7, 16, 42, 0.88);
  color: #fff; text-align: center; text-shadow: 0 1px 4px rgba(0, 0, 0, 0.8);
  box-shadow: 0 0 60px rgba(0, 0, 0, 0.45);
  transition: clip-path 0.4s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.3s, overlay 0.4s allow-discrete, display 0.4s allow-discrete;
}
#launcher.oss-layout-xmb ~ :is(#license-agreement, #system-notice, #memory-warning):not([open]) { clip-path: inset(0 50%); opacity: 0; }
@starting-style {
  #launcher.oss-layout-xmb ~ :is(#license-agreement, #system-notice, #memory-warning)[open] { clip-path: inset(0 50%); opacity: 0; }
}
#launcher.oss-layout-xmb ~ :is(#license-agreement, #system-notice, #memory-warning)::backdrop {
  background: rgba(0, 0, 0, 0.62); transition: background-color 0.4s, overlay 0.4s allow-discrete, display 0.4s allow-discrete;
}
#launcher.oss-layout-xmb ~ :is(#license-agreement, #system-notice, #memory-warning):not([open])::backdrop { background-color: transparent; }
@starting-style {
  #launcher.oss-layout-xmb ~ :is(#license-agreement, #system-notice, #memory-warning)[open]::backdrop { background-color: transparent; }
}
#launcher.oss-layout-xmb ~ :is(#license-agreement, #system-notice, #memory-warning) h2 { margin-bottom: 14px; font-size: 1.3rem; font-weight: 400; color: #fff; }
#launcher.oss-layout-xmb ~ #memory-warning h2 { color: #ffd166; }
#launcher.oss-layout-xmb ~ :is(#license-agreement, #system-notice, #memory-warning) p { font-size: 15px; color: rgba(255, 255, 255, 0.9); }
#launcher.oss-layout-xmb ~ #license-agreement .license-agreement-name { color: #fff; }
#launcher.oss-layout-xmb ~ #license-agreement a { color: #9fd0ff; }
#launcher.oss-layout-xmb ~ #system-notice .system-notice-never { margin-left: auto; margin-right: auto; color: rgba(255, 255, 255, 0.9); }
#launcher.oss-layout-xmb ~ #system-notice .system-notice-never input { accent-color: #9fd0ff; }
#launcher.oss-layout-xmb ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions { justify-content: center; gap: 28px; margin-top: 8px; }
#launcher.oss-layout-xmb ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button {
  padding: 6px 22px; border: 0; border-radius: 6px; background: none; color: rgba(255, 255, 255, 0.78);
  font-size: 1.1rem; font-weight: 400; text-shadow: inherit; transition: color 0.2s, background 0.2s, transform 0.2s, box-shadow 0.2s;
}
#launcher.oss-layout-xmb ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions .primary { color: #fff; text-shadow: 0 0 10px rgba(255, 255, 255, 0.55), 0 1px 4px rgba(0, 0, 0, 0.8); }
#launcher.oss-layout-xmb ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button:is(:hover, :focus-visible) {
  outline: none; color: #fff; transform: scale(1.08); background: rgba(255, 255, 255, 0.1);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4), 0 0 20px rgba(255, 255, 255, 0.22);
  text-shadow: 0 0 12px rgba(255, 255, 255, 0.85);
}

/* ---- PS4-style: a dark translucent panel, white text, rounded buttons with a bright focus glow ---- */

#launcher.oss-layout-ps4 ~ :is(#license-agreement, #system-notice, #memory-warning) {
  --dialog-theme: ps4;
  max-width: 600px; padding: 26px 30px 24px; border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 8px;
  background: rgba(11, 25, 58, 0.95); color: #fff;
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.08);
  transition: transform 0.28s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.22s, overlay 0.28s allow-discrete, display 0.28s allow-discrete;
}
#launcher.oss-layout-ps4 ~ :is(#license-agreement, #system-notice, #memory-warning):not([open]) { transform: scale(0.95); opacity: 0; }
@starting-style {
  #launcher.oss-layout-ps4 ~ :is(#license-agreement, #system-notice, #memory-warning)[open] { transform: scale(0.95); opacity: 0; }
}
#launcher.oss-layout-ps4 ~ :is(#license-agreement, #system-notice, #memory-warning)::backdrop {
  background: rgba(2, 8, 24, 0.62); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  transition: background-color 0.28s, overlay 0.28s allow-discrete, display 0.28s allow-discrete;
}
#launcher.oss-layout-ps4 ~ :is(#license-agreement, #system-notice, #memory-warning):not([open])::backdrop { background-color: transparent; }
@starting-style {
  #launcher.oss-layout-ps4 ~ :is(#license-agreement, #system-notice, #memory-warning)[open]::backdrop { background-color: transparent; }
}
#launcher.oss-layout-ps4 ~ :is(#license-agreement, #system-notice, #memory-warning) h2 { margin-bottom: 14px; font-size: 1.6rem; font-weight: 300; color: #fff; }
#launcher.oss-layout-ps4 ~ #memory-warning h2 { color: #ffd166; }
#launcher.oss-layout-ps4 ~ :is(#license-agreement, #system-notice, #memory-warning) p { font-size: 15px; color: rgba(255, 255, 255, 0.88); }
#launcher.oss-layout-ps4 ~ #license-agreement .license-agreement-name { color: #fff; }
#launcher.oss-layout-ps4 ~ #license-agreement a { color: #8cc4ff; }
#launcher.oss-layout-ps4 ~ #system-notice .system-notice-never { color: rgba(255, 255, 255, 0.88); }
#launcher.oss-layout-ps4 ~ #system-notice .system-notice-never input { accent-color: #4ea3ff; }
#launcher.oss-layout-ps4 ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions { gap: 12px; margin-top: 6px; }
#launcher.oss-layout-ps4 ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button {
  min-width: 120px; padding: 11px 24px; border: 1px solid rgba(255, 255, 255, 0.6); border-radius: 6px;
  background: rgba(255, 255, 255, 0.1); color: #fff; font-size: 15px; font-weight: 600;
  transition: transform 0.15s, box-shadow 0.15s, background 0.15s;
}
#launcher.oss-layout-ps4 ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions .primary { border-color: #fff; background: #fff; color: #0b2c6b; }
#launcher.oss-layout-ps4 ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button:is(:hover, :focus-visible) {
  outline: none; transform: scale(1.03); box-shadow: 0 0 0 3px #4ea3ff, 0 0 20px rgba(78, 163, 255, 0.55);
}

/* ---- Metro: a band across the middle in the layout's purple, a large light title, buttons at the bottom right ---- */

#launcher.oss-layout-metro ~ :is(#license-agreement, #system-notice, #memory-warning) {
  --dialog-theme: metro;
  left: 0; right: 0; margin: auto 0; width: 100%; max-width: none;
  padding: 28px max(24px, env(safe-area-inset-right, 0px), calc((100% - 720px) / 2)) 24px max(24px, env(safe-area-inset-left, 0px), calc((100% - 720px) / 2));
  border: 0; border-radius: 0; background: #6b2fbf; color: #fff;
  font-family: "Segoe UI", system-ui, sans-serif;
  transition: opacity 0.25s, overlay 0.25s allow-discrete, display 0.25s allow-discrete;
}
#launcher.oss-layout-metro ~ :is(#license-agreement, #system-notice, #memory-warning):not([open]) { opacity: 0; }
@starting-style {
  #launcher.oss-layout-metro ~ :is(#license-agreement, #system-notice, #memory-warning)[open] { opacity: 0; }
}
#launcher.oss-layout-metro ~ :is(#license-agreement, #system-notice, #memory-warning)[open] > * { animation: dlg-mt-in 0.5s cubic-bezier(0.1, 0.9, 0.2, 1) both; }
#launcher.oss-layout-metro ~ :is(#license-agreement, #system-notice, #memory-warning)[open] > :nth-child(2) { animation-delay: 0.04s; }
#launcher.oss-layout-metro ~ :is(#license-agreement, #system-notice, #memory-warning)[open] > :nth-child(n + 3) { animation-delay: 0.08s; }
@keyframes dlg-mt-in { from { opacity: 0; transform: translateX(48px); } }
#launcher.oss-layout-metro ~ :is(#license-agreement, #system-notice, #memory-warning)::backdrop {
  background: rgba(0, 0, 0, 0.6); transition: background-color 0.25s, overlay 0.25s allow-discrete, display 0.25s allow-discrete;
}
#launcher.oss-layout-metro ~ :is(#license-agreement, #system-notice, #memory-warning):not([open])::backdrop { background-color: transparent; }
@starting-style {
  #launcher.oss-layout-metro ~ :is(#license-agreement, #system-notice, #memory-warning)[open]::backdrop { background-color: transparent; }
}
#launcher.oss-layout-metro ~ :is(#license-agreement, #system-notice, #memory-warning) h2 { margin-bottom: 14px; font-size: clamp(1.6rem, 3vw, 2.1rem); font-weight: 300; line-height: 1.15; color: #fff; }
#launcher.oss-layout-metro ~ #memory-warning h2 { color: #ffd98a; }
#launcher.oss-layout-metro ~ :is(#license-agreement, #system-notice, #memory-warning) p { font-size: 15px; color: #fff; }
#launcher.oss-layout-metro ~ #license-agreement .license-agreement-name { color: #fff; }
#launcher.oss-layout-metro ~ #license-agreement a { color: #fff; }
#launcher.oss-layout-metro ~ #system-notice .system-notice-never { color: #fff; }
#launcher.oss-layout-metro ~ #system-notice .system-notice-never input { accent-color: #fff; }
#launcher.oss-layout-metro ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions { gap: 10px; margin-top: 8px; }
#launcher.oss-layout-metro ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button {
  min-width: 110px; padding: 6px 20px; border: 2px solid #fff; border-radius: 0; background: transparent; color: #fff;
  font-size: 15px; font-weight: 600;
}
#launcher.oss-layout-metro ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button:hover { background: rgba(255, 255, 255, 0.18); }
#launcher.oss-layout-metro ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions .primary { background: #fff; color: #6b2fbf; }
#launcher.oss-layout-metro ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions .primary:hover { background: #ececf4; }
#launcher.oss-layout-metro ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button:focus-visible { outline: 2px dotted #fff; outline-offset: 3px; }

/* ---- Windows 11-style: an app dialog window, like a setup program's license step: a title bar with the
   system's icon and name (emulator.js puts them in data-system and --system-icon), a Mica-like surface,
   and a bar of buttons at the bottom with the accent button. ---- */

#launcher.oss-layout-win11 ~ :is(#license-agreement, #system-notice, #memory-warning) {
  --dialog-theme: win11;
  max-width: 560px; padding: 0; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 8px;
  background: rgba(36, 36, 44, 0.96); color: #fff;
  -webkit-backdrop-filter: blur(50px) saturate(1.3); backdrop-filter: blur(50px) saturate(1.3);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.55), 0 4px 16px rgba(0, 0, 0, 0.3);
  font-family: "Segoe UI Variable", "Segoe UI", system-ui, sans-serif;
  transition: transform 0.2s cubic-bezier(0.1, 0.9, 0.2, 1), opacity 0.16s, overlay 0.2s allow-discrete, display 0.2s allow-discrete;
}
#launcher.oss-layout-win11 ~ :is(#license-agreement, #system-notice, #memory-warning):not([open]) { transform: scale(1.04); opacity: 0; }
@starting-style {
  #launcher.oss-layout-win11 ~ :is(#license-agreement, #system-notice, #memory-warning)[open] { transform: scale(1.04); opacity: 0; }
}
#launcher.oss-layout-win11 ~ :is(#license-agreement, #system-notice, #memory-warning)::backdrop {
  background: rgba(0, 0, 0, 0.32); transition: background-color 0.2s, overlay 0.2s allow-discrete, display 0.2s allow-discrete;
}
#launcher.oss-layout-win11 ~ :is(#license-agreement, #system-notice, #memory-warning):not([open])::backdrop { background-color: transparent; }
@starting-style {
  #launcher.oss-layout-win11 ~ :is(#license-agreement, #system-notice, #memory-warning)[open]::backdrop { background-color: transparent; }
}
#launcher.oss-layout-win11 ~ :is(#license-agreement, #system-notice, #memory-warning)::before {
  content: attr(data-system); content: attr(data-system) / ""; flex: none; display: block; height: 32px; padding: 0 16px 0 40px;
  overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 12px; line-height: 32px; color: #fff;
  background: var(--system-icon, none) 13px 50% / 14px 14px no-repeat, linear-gradient(#fff, #fff) 12px 50% / 16px 16px no-repeat;
}
#launcher.oss-layout-win11 ~ :is(#license-agreement, #system-notice, #memory-warning) h2 { margin: 6px 24px 12px; font-size: 20px; font-weight: 600; line-height: 28px; color: #fff; }
#launcher.oss-layout-win11 ~ #memory-warning h2 { color: #fce100; }
#launcher.oss-layout-win11 ~ :is(#license-agreement, #system-notice, #memory-warning) :is(#license-agreement-text, #system-notice-text, .memory-warning-text) { margin: 0 24px; }
#launcher.oss-layout-win11 ~ #license-agreement #license-agreement-text {
  padding: 12px 14px 0; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 6px; background: rgba(0, 0, 0, 0.18);
}
#launcher.oss-layout-win11 ~ :is(#license-agreement, #system-notice, #memory-warning) p { font-size: 14px; line-height: 20px; color: rgba(255, 255, 255, 0.86); }
#launcher.oss-layout-win11 ~ #license-agreement p:last-child { margin-bottom: 12px; }
#launcher.oss-layout-win11 ~ #license-agreement .license-agreement-name { color: #fff; }
#launcher.oss-layout-win11 ~ #license-agreement a { color: #99ebff; }
#launcher.oss-layout-win11 ~ #system-notice .system-notice-never { margin: 2px 24px 0; color: rgba(255, 255, 255, 0.86); }
#launcher.oss-layout-win11 ~ #system-notice .system-notice-never input { accent-color: #4cc2ff; }
#launcher.oss-layout-win11 ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions {
  gap: 8px; margin-top: 20px; padding: 20px 24px; padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid rgba(255, 255, 255, 0.06); background: #1d1d23;
}
#launcher.oss-layout-win11 ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button {
  min-width: 120px; min-height: 32px; padding: 5px 16px; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 4px;
  background: #34343c; color: #fff; font-size: 14px; font-weight: 400;
}
#launcher.oss-layout-win11 ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button:hover { background: #3c3c45; }
#launcher.oss-layout-win11 ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions .primary { border-color: transparent; background: #4cc2ff; color: #000; }
#launcher.oss-layout-win11 ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions .primary:hover { background: #47b1e8; }
#launcher.oss-layout-win11 ~ :is(#license-agreement, #system-notice, #memory-warning) .dialog-actions button:focus-visible { outline: 2px solid #fff; outline-offset: 1px; }

/* ---- Less motion when the device asks for it ---- */

@media (prefers-reduced-motion: reduce) {
  #launcher ~ :is(#license-agreement, #system-notice, #memory-warning),
  #launcher ~ :is(#license-agreement, #system-notice, #memory-warning)::backdrop,
  #launcher ~ :is(#license-agreement, #system-notice, #memory-warning) * { transition: none !important; animation: none !important; }
}