main { width: min(100%, 1500px); margin: auto; padding: 32px 24px; }

.landing-page {
  display: grid;
  min-height: 100svh;
  place-items: center;
  padding: clamp(24px, 5vw, 72px);
  background:
    radial-gradient(circle at 14% 15%, #352842 0, transparent 34%),
    radial-gradient(circle at 88% 82%, #19384a 0, transparent 31%),
    #11151d;
}

.landing-shell {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
  grid-template-areas:
    "brand brand"
    "gradient copy";
  gap: clamp(32px, 6vw, 88px);
  align-items: center;
  width: min(1180px, 100%);
}

.landing-brand { grid-area: brand; }
.landing-gradient { grid-area: gradient; }
.landing-copy { grid-area: copy; }
.landing-actions { display: grid; gap: 15px; margin-top: 32px; }

header {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  margin-bottom: 28px;
  padding-bottom: 24px;
  border-bottom: 1px solid #343b49;
}

.brand { display: flex; gap: 12px; align-items: baseline; }
.brand > span { color: #aab4c6; font-size: 14px; }
header > .quiet-button { margin-left: 0; }
header > .danger-button { margin-left: auto; }

.mode-selector { display: grid; grid-template-columns: repeat(3, minmax(0, max-content)); gap: 8px; width: 100%; margin-bottom: 14px; }
.controls { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 24px; }
.controls label { display: inline-flex; gap: 12px; align-items: center; margin: 0; }
.setting-group { padding: 12px 14px; border: 1px solid #343b49; border-radius: 12px; background: #191f2a; }
.controls > .muted { flex-basis: 100%; margin: 0; }
.control-actions, .actions { display: inline-flex; flex-wrap: wrap; gap: 9px; }
.instruction { display: flex; gap: 20px; align-items: start; justify-content: space-between; }
.instruction p { margin: 0; }
.stats { display: flex; gap: 28px; margin: 28px 0; }
.actions { margin-top: 22px; }
.dialog-actions { display: flex; gap: 9px; justify-content: flex-end; }
.mode-panel { align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 24px; padding: 12px 14px; border: 1px solid #343b49; border-radius: 12px; background: #191f2a; }
.mode-panel:not([hidden]) { display: flex; }
.mode-panel p { margin: 3px 0 0; }