select.site-model-control,
input.site-model-control {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  border: 0 !important;
  overflow: hidden !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.site-control {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
  min-width: 0;
  max-width: 100%;
  padding: 10px 12px;
  border: 1px solid #dfe2e5;
  border-radius: 8px;
  background: #fff;
  color: #35383b;
  font: inherit;
  text-align: left;
  line-height: 1.4;
  transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease, transform .24s var(--icon-spring, cubic-bezier(.34, 1.56, .64, 1));
}
.site-control:hover:not(:disabled), .site-control[aria-expanded="true"] { border-color: #07c160; background: #fbfffc; }
.site-control:focus-visible, .site-stepper input:focus-visible, .site-panel button:focus-visible, .site-panel input:focus-visible {
  outline: 3px solid #83d7a7;
  outline-offset: 2px;
}
.site-control-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.site-control.is-empty { color: #7b8187; }
.toolbar .site-select-button { flex: 0 1 220px; min-width: 140px; }
#richTools .site-select-button { padding: 7px 10px; width: auto; min-width: 92px; font-weight: 400; }
.english-editor .site-select-button { width: 100%; margin-top: 10px; }
.editor-field .site-date-button { width: 100%; font-size: 14px; font-weight: 400; padding: 12px 13px; }

.site-icon { position: relative; display: inline-block; flex: 0 0 16px; width: 16px; height: 16px; color: #248653; transition: transform .32s var(--icon-spring, cubic-bezier(.34, 1.56, .64, 1)); }
.site-control:hover .site-icon, .site-control:focus-visible .site-icon, .site-icon-button:hover .site-icon, .site-icon-button:focus-visible .site-icon, .site-stepper-button:hover .site-icon, .site-stepper-button:focus-visible .site-icon { transform: scale(1.14); }
.site-control:active .site-icon, .site-icon-button:active .site-icon, .site-stepper-button:active .site-icon { transform: scale(.88); }
.site-icon-chevron::before { content: ""; position: absolute; left: 4px; top: 4px; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .32s var(--icon-spring, cubic-bezier(.34, 1.56, .64, 1)); }
.site-control[aria-expanded="true"] .site-icon-chevron::before { transform: translateY(3px) rotate(225deg); }
.site-icon-calendar::before { content: ""; position: absolute; inset: 3px 1px 1px; border: 1.7px solid currentColor; border-radius: 2px; }
.site-icon-calendar::after { content: ""; position: absolute; left: 2px; right: 2px; top: 6px; border-top: 1.7px solid currentColor; box-shadow: 3px 4px 0 -1px currentColor, 8px 4px 0 -1px currentColor; }
.site-icon-previous::before, .site-icon-next::before { content: ""; position: absolute; top: 4px; left: 5px; width: 7px; height: 7px; border-left: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); }
.site-icon-next::before { transform: rotate(225deg); left: 3px; }
.site-icon-minus::before, .site-icon-plus::before, .site-icon-plus::after { content: ""; position: absolute; top: 7px; left: 3px; width: 10px; border-top: 2px solid currentColor; }
.site-icon-plus::after { transform: rotate(90deg); }

.site-panel {
  position: fixed;
  z-index: 1000;
  min-width: 0;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 5px;
  border: 1px solid #dce8df;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 14px 32px #20212425;
  color: #35383b;
  font: 14px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  animation: site-panel-in .2s cubic-bezier(.2, .8, .25, 1) both;
}
.site-panel-above { transform-origin: bottom center; }
@keyframes site-panel-in { from { opacity: 0; transform: translateY(-5px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
.site-options [role="option"] { padding: 9px 11px; border-radius: 5px; overflow-wrap: anywhere; cursor: pointer; }
.site-options [role="option"].is-active { background: #effaf3; color: #087b3d; }
.site-options [role="option"][aria-selected="true"] { font-weight: 650; }
.site-options [role="option"][aria-disabled="true"] { opacity: .45; cursor: default; }
.site-calendar { padding: 12px; }
.site-calendar button { font: inherit; cursor: pointer; }
.site-calendar-header { display: flex; align-items: center; justify-content: space-between; gap: 5px; margin-bottom: 12px; }
.site-icon-button { display: inline-grid; place-items: center; flex: 0 0 30px; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 5px; background: transparent; }
.site-icon-button:hover, .site-calendar-grid button:hover, .site-calendar-footer button:hover { background: #effaf3; }
.site-calendar-number { min-width: 0; width: 55px; padding: 6px 4px; border: 1px solid #dfe2e5; border-radius: 5px; background: #fff; text-align: center; font: inherit; }
.site-calendar-header .site-calendar-number:first-of-type { width: 68px; }
.site-calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px; text-align: center; }
.site-calendar-grid > span, .site-calendar-grid > button { display: grid; place-items: center; height: 34px; min-width: 0; }
.site-calendar-grid > span { color: #717b75; font-size: 12px; }
.site-calendar-grid > button { padding: 0; border: 0; border-radius: 5px; background: transparent; color: #35383b; }
.site-calendar-grid > button[aria-pressed="true"] { background: #07a951; color: white; }
.site-calendar-grid > button[aria-pressed="true"]:hover { background: #078d42; }
.site-calendar-time { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 0; }
.site-calendar-footer { display: flex; gap: 4px; justify-content: flex-end; border-top: 1px solid #e9eeea; padding-top: 10px; }
.site-calendar-footer button { padding: 6px 9px; border: 0; border-radius: 5px; background: transparent; color: #245a3a; }
.site-calendar-footer .site-calendar-apply { background: #07a951; color: white; }
.site-calendar-footer .site-calendar-apply:hover { background: #078d42; }
.site-stepper { display: flex; align-items: stretch; width: 100%; border: 1px solid #dfe2e5; border-radius: 8px; background: #fff; overflow: hidden; }
.site-stepper:focus-within { border-color: #07c160; box-shadow: 0 0 0 3px #07c1601c; }
.site-stepper input { width: 100%; min-width: 0; flex: 1; padding: 10px 12px; border: 0; background: transparent; color: #35383b; font: inherit; }
.site-stepper input:focus { outline: 0; box-shadow: none; }
.site-stepper-button { display: grid; place-items: center; flex: 0 0 36px; padding: 0; border: 0; background: #f7fbf8; }
.site-stepper-button:first-child { border-right: 1px solid #e5ebe6; }
.site-stepper-button:last-child { border-left: 1px solid #e5ebe6; }
.site-stepper-button:hover { background: #effaf3; }
input[type="checkbox"]:not([hidden]) { appearance: none; display: inline-grid; place-items: center; flex: 0 0 18px; width: 18px; height: 18px; margin: 0 6px 0 0; vertical-align: middle; border: 1.5px solid #869a8c; border-radius: 4px; background: white; cursor: pointer; transition: background-color .18s ease, border-color .18s ease; }
input[type="checkbox"]:checked { background: #07a951; border-color: #07a951; }
input[type="checkbox"]:checked::after { content: ""; width: 8px; height: 4px; border-left: 2px solid white; border-bottom: 2px solid white; transform: translateY(-1px) rotate(-45deg); }
input[type="checkbox"]:focus-visible { outline: 3px solid #83d7a7; outline-offset: 2px; }
input[type="checkbox"]:disabled { opacity: .5; cursor: not-allowed; }
details > summary { list-style: none; cursor: pointer; }
details > summary::-webkit-details-marker { display: none; }
details > summary::before { content: ""; display: inline-block; width: 7px; height: 7px; margin: 0 10px 2px 2px; border-right: 2px solid #168449; border-bottom: 2px solid #168449; transform: rotate(-45deg); transition: transform .32s var(--icon-spring, cubic-bezier(.34, 1.56, .64, 1)); }
details[open] > summary::before { transform: translateY(-2px) rotate(45deg); }
details > summary:hover::before, details > summary:focus-visible::before { border-color: #07c160; }
label[for="importBackup"][role="button"] { cursor: pointer; }
label[for="importBackup"][role="button"]:focus-visible { outline: 3px solid #83d7a7; outline-offset: 2px; }
@media (max-width: 520px) { .toolbar .site-select-button { flex: 1 1 140px; } }
@media (prefers-reduced-motion: reduce) { .site-control, .site-icon, .site-icon-chevron::before, details > summary::before { transition: none !important; } .site-panel { animation: none !important; } }
