:root {
  --safe-bottom: env(safe-area-inset-bottom, 12px);
  --slot-w: 68px;
  --day-h: 42px;
  --hour-h: 76px;
}
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html, body {
  width:100%; height:100%; height:100dvh;
  overflow:hidden;
  font-family:-apple-system,BlinkMacSystemFont,'SF Pro Display','Segoe UI',system-ui,sans-serif;
  user-select:none; -webkit-user-select:none;
  -webkit-tap-highlight-color:transparent;
  touch-action:none;
  background:#060d1f;
}

@media(min-width:768px){
  :root{ --slot-w:74px; }
  #days{ padding:11px 20px 9px; gap:9px; }
  #hrs{ padding:8px 20px 12px; gap:4px; }
  .dpill{ padding:8px 18px; font-size:13px; }
  .hslot{ border-radius:14px; gap:5px; padding:8px 6px; }
}
@media(max-width:380px){
  :root{ --slot-w:58px; }
  #days{ padding:8px 10px 6px; gap:5px; }
  #hrs{ padding:5px 10px 9px; gap:2px; }
  .dpill{ padding:6px 11px; font-size:11px; }
  .hi{ font-size:14px; }
  .ht,.hv{ font-size:10px; }
}