/* Scoped to the HighbiniOT calendar; no changes to other pages. */
.hb-calendar {
  --hb-cal-ink: #382913;
  --hb-cal-line: #9a8864;
  --hb-cal-paper: #e6d7ad;
  --hb-cal-cell: #d3c4a6;
  --hb-cal-cell-muted: #c3b594;
  --hb-cal-special: #286000;
  --hb-cal-bonus: #21596a;
  --hb-cal-seasonal: #0d5471;
  --hb-cal-global: #6d1837;
  --hb-cal-boss: #6c226d;
  --hb-cal-pvp: #786214;
  color: var(--hb-cal-ink);
  font-family: Verdana, Arial, sans-serif;
  font-size: 10px;
  line-height: 1.45;
  width: 100%;
  min-width: 0;
}
.hb-calendar *, .hb-calendar *::before, .hb-calendar *::after { box-sizing: border-box; }
.hb-calendar .hb-calendar__toolbar,
.hb-calendar .hb-calendar__legend-title {
  background: linear-gradient(180deg, #173b51 0%, #122e43 47%, #0d2236 100%);
  border: 2px solid #c19542;
  box-shadow: inset 0 0 0 1px #534127, inset 0 0 0 3px #203c4d, 0 1px 2px #1c180d;
  color: #f4e4bf;
  min-height: 31px;
  padding: 3px 14px;
  text-shadow: 1px 1px 0 #090d15;
}
.hb-calendar .hb-calendar__toolbar { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-radius: 10px 4px 10px 4px; }
.hb-calendar .hb-calendar__heading { display: flex; align-items: center; gap: 7px; min-width: 0; }
.hb-calendar .hb-calendar__heading h2 { font: bold 12px Georgia, 'Times New Roman', serif; letter-spacing: 1.1px; text-transform: uppercase; color: inherit; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; }
.hb-calendar .hb-calendar__calendar-icon { flex: 0 0 15px; color: #f2e2bd; }
.hb-calendar .hb-calendar__arrow { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 16px; min-height: 23px; color: #ecbe52; font: bold 25px/20px Georgia, serif; text-decoration: none; text-shadow: 1px 1px #000; }
.hb-calendar .hb-calendar__arrow:hover { color: #fff0ae; }
.hb-calendar .hb-calendar__clock { color: #b8bac6; font: 10px Verdana, sans-serif; white-space: nowrap; }
.hb-calendar .hb-calendar__surface { position: relative; margin: 0 2px; padding: 12px 17px 16px; background: var(--hb-cal-paper); border: 2px solid #b68d36; border-top: 0; border-radius: 0 0 4px 4px; box-shadow: inset 0 0 11px #b89c5b70, 0 2px 3px #1e180b66; }
.hb-calendar .hb-calendar__grid { border-collapse: collapse; table-layout: fixed; border: 1px solid var(--hb-cal-line); width: 100%; margin: 0; padding: 0; color: var(--hb-cal-ink); background: var(--hb-cal-cell); font: 9px/1.35 Verdana, Arial, sans-serif; }
.hb-calendar .hb-calendar__grid th { border: 1px solid var(--hb-cal-line); height: 30px; padding: 5px 2px; background: #cbbc99; font: normal 10px Verdana, Arial, sans-serif; text-align: center; color: #3c2d17; }
.hb-calendar .hb-calendar__grid th.hb-calendar__weekend { color: #a10000; }
.hb-calendar .hb-calendar__grid td { height: 72px; vertical-align: top; padding: 2px; border: 1px solid var(--hb-cal-line); background: var(--hb-cal-cell); }
.hb-calendar .hb-calendar__cell { min-height: 65px; }
.hb-calendar .hb-calendar__grid td.hb-calendar__day--outside { background: var(--hb-cal-cell-muted); }
.hb-calendar .hb-calendar__date { display: inline-block; min-width: 15px; height: 17px; padding: 1px 1px 0; color: #382a17; font-weight: bold; text-align: left; }
.hb-calendar .hb-calendar__day--weekend .hb-calendar__date { color: #a40000; }
.hb-calendar .hb-calendar__day--outside .hb-calendar__date { opacity: .55; }
.hb-calendar .hb-calendar__grid td.hb-calendar__day--today { background: #e1d1a8; box-shadow: inset 0 0 0 2px #bd8a19; }
.hb-calendar .hb-calendar__day--today .hb-calendar__date { border-radius: 2px; background: #173f52; color: #fff2bc; text-align: center; }
.hb-calendar .hb-calendar__events { display: flex; flex-direction: column; gap: 2px; }
.hb-calendar .hb-calendar__event { display: block; min-width: 0; height: 14px; padding: 1px 3px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font: 8px/12px Verdana, Arial, sans-serif; color: #fff6db; text-decoration: none; text-shadow: 0 1px #0006; border: 0; border-radius: 0; }
.hb-calendar .hb-calendar__event:hover { filter: brightness(1.23); text-decoration: none; color: #fff; }
.hb-calendar .hb-calendar__event:focus-visible,
.hb-calendar .hb-calendar__arrow:focus-visible,
.hb-calendar .hb-calendar__today-link:focus-visible,
.hb-calendar .hb-calendar__close:focus-visible { outline: 2px solid #004fc1; outline-offset: 2px; }
.hb-calendar .hb-calendar__event--special, .hb-calendar .hb-calendar__swatch--special { background: var(--hb-cal-special); }
.hb-calendar .hb-calendar__event--bonus, .hb-calendar .hb-calendar__swatch--bonus { background: var(--hb-cal-bonus); }
.hb-calendar .hb-calendar__event--seasonal, .hb-calendar .hb-calendar__swatch--seasonal { background: var(--hb-cal-seasonal); }
.hb-calendar .hb-calendar__event--global, .hb-calendar .hb-calendar__swatch--global { background: var(--hb-cal-global); }
.hb-calendar .hb-calendar__event--boss, .hb-calendar .hb-calendar__swatch--boss { background: var(--hb-cal-boss); }
.hb-calendar .hb-calendar__event--pvp, .hb-calendar .hb-calendar__swatch--pvp { background: var(--hb-cal-pvp); }
.hb-calendar .hb-calendar__note { margin: 10px 42px 0 0; font: 8px/1.6 Verdana, Arial, sans-serif; color: #5c4027; }
.hb-calendar .hb-calendar__today-link { position: absolute; bottom: 14px; right: 17px; color: #154b66; text-decoration: underline; font-size: 9px; }
.hb-calendar .hb-calendar__legend-title { margin-top: 15px; min-height: 30px; display: flex; align-items: center; font: bold 12px Georgia, 'Times New Roman', serif; text-transform: uppercase; letter-spacing: .7px; border-radius: 8px 4px 8px 4px; }
.hb-calendar .hb-calendar__legend { display: flex; flex-wrap: wrap; align-items: center; gap: 9px 14px; margin: 0 2px; padding: 12px 17px 14px; background: var(--hb-cal-paper); border: 2px solid #b68d36; border-top: 0; border-radius: 0 0 4px 4px; box-shadow: inset 0 0 9px #b89c5b55, 0 1px 3px #1e180b66; }
.hb-calendar .hb-calendar__legend-item { display: inline-flex; align-items: center; gap: 7px; color: #655542; font: 10px Verdana, Arial, sans-serif; }
.hb-calendar .hb-calendar__swatch { display: inline-block; flex: 0 0 14px; width: 14px; height: 14px; border-radius: 3px; }
.hb-calendar .hb-calendar__dialog { max-width: min(430px, calc(100vw - 30px)); margin: auto; padding: 0 19px 17px; border: 2px solid #ba8e32; border-radius: 5px; background: #e8d9b5; color: var(--hb-cal-ink); box-shadow: 0 8px 40px #0009, inset 0 0 15px #c2a05d66; font: 12px/1.6 Verdana, Arial, sans-serif; }
.hb-calendar .hb-calendar__dialog::backdrop { background: #06131ed1; }
.hb-calendar .hb-calendar__dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 -19px 13px; padding: 8px 12px 8px 18px; background: #173449; color: #f5e6c3; }
.hb-calendar .hb-calendar__dialog-header h3 { color: inherit; background: none; border: 0; margin: 0; padding: 0; font: bold 16px Georgia, serif; }
.hb-calendar .hb-calendar__close { background: none; border: none; color: #f5e6c3; font: 25px/1 Verdana, sans-serif; width: 30px; height: 30px; padding: 0; cursor: pointer; }
.hb-calendar .hb-calendar__dialog-date { font-weight: bold; color: #72551d; }
.hb-calendar .hb-calendar__dialog-recurring { margin-top: 16px; font-size: 10px; font-style: italic; }
.hb-calendar .hb-calendar__fallback { padding: 12px; background: #e6d7ad; }
@media (max-width: 600px) {
  .hb-calendar .hb-calendar__surface { padding: 10px 7px 14px; }
  .hb-calendar .hb-calendar__toolbar { padding: 3px 7px; flex-wrap: wrap; }
  .hb-calendar .hb-calendar__heading { gap: 3px; }
  .hb-calendar .hb-calendar__heading h2 { font-size: 11px; letter-spacing: .5px; }
  .hb-calendar .hb-calendar__clock { font-size: 8px; margin-left: auto; }
  .hb-calendar .hb-calendar__grid th { font-size: 9px; height: 27px; }
  .hb-calendar .hb-calendar__grid td { padding: 2px 1px; height: 70px; }
  .hb-calendar .hb-calendar__event { padding: 1px 2px; font-size: 7px; }
  .hb-calendar .hb-calendar__note { font-size: 8px; }
  .hb-calendar .hb-calendar__today-link { right: 8px; }
  .hb-calendar .hb-calendar__legend { padding: 10px; gap: 9px 12px; }
  .hb-calendar .hb-calendar__legend-item { gap: 5px; font-size: 9px; }
}