:root { color-scheme: light; }
body:has(.pilot-page) {
  margin: 0;
  background: #eff4fa;
  color: #17283c;
  font: 16px/1.55 system-ui, sans-serif;
}
.pilot-page { width: min(100% - 32px, 760px); margin: 32px auto; }
.pilot-page h1, #pilot-tools h2 { line-height: 1.2; }
.pilot-page section, #pilot-tools {
  box-sizing: border-box;
  padding: clamp(16px, 4vw, 28px);
  border: 1px solid #d1dce9;
  border-radius: 16px;
  background: #fff;
  color: #17283c;
  overflow-wrap: anywhere;
}
.pilot-page section + section { margin-top: 16px; }
.pilot-page form, #pilot-tools form { display: grid; gap: 12px; }
.pilot-page label, #pilot-tools label { display: grid; gap: 4px; }
.pilot-page label[hidden] { display: none; }
.pilot-page :is(input,select,button), #pilot-tools :is(select,button,input,textarea), #pilot-account button {
  box-sizing: border-box;
  min-height: 44px;
  max-width: 100%;
  padding: 8px 12px;
  border: 1px solid #7489a1;
  border-radius: 8px;
  font: inherit;
}
.pilot-page button, #pilot-tools button, #pilot-account button {
  width: fit-content;
  background: #183e66;
  color: #fff;
  cursor: pointer;
}
.pilot-page button:disabled, #pilot-tools button:disabled { opacity:.55; cursor:wait; }
.pilot-page :focus-visible, #pilot-tools :focus-visible, #pilot-account :focus-visible { outline: 3px solid #0f6bad; outline-offset: 2px; }
.pilot-page ul, #pilot-tools ul { padding-inline-start: 18px; }
.pilot-page li, #pilot-tools li { margin-block: 12px; }
.pilot-page p.recap { white-space: pre-wrap; }
.pilot-row, #pilot-account { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
#pilot-tools { width:min(100% - 24px,720px); max-width:none; max-height:calc(100dvh - 24px); overflow:auto; }
#pilot-account { margin:8px 16px; }
html[data-pilot-locked] :is(#app-shell,#public-page,.skip-link,dialog) { display:none!important; }

html[data-pilot-build] [data-nav="eleves"],
html[data-pilot-build] [data-nav="organisateur"],
html[data-pilot-build] [data-action="edit-payment-link"],
html[data-pilot-build] [data-action="new-payment-link"],
html[data-pilot-build] #organizer-shortcut,
html[data-pilot-profile="teacher"] :is([data-nav="bookings"],[data-nav="dj"],[data-action="new-booking"]),
html[data-pilot-profile="dj"] :is([data-nav="private"],[data-action="new-private"]) { display:none!important; }
