.activity-selector button{font-size:12px!important;color:#28313d!important;font-weight:650!important}
.activity-selector button span{font-size:12px;line-height:1.2}
.activity-selector button.active{color:#142b48!important}
#checkinButton{min-height:38px!important;padding:0 16px!important;font-size:12px!important;line-height:1;font-weight:700!important}
#checkinButton:disabled{background:#d8f0d3!important;color:#234c27!important;opacity:1}
@media(min-width:600px){
  #route-activity{position:fixed;top:88px;right:0;bottom:0;left:184px;z-index:10;min-width:0;padding:0 28px 24px;overflow:hidden;background:var(--surface)}
  #route-activity:not(.active){display:none!important}
  #route-activity.active{display:grid!important;grid-template-rows:auto minmax(0,1fr)}
  #route-activity .activity-selector{position:relative;top:auto;min-width:0;margin:0 -28px;padding:10px 28px;border-bottom:1px solid var(--outline-variant)}
  #route-activity .activity-selector img{filter:brightness(0) saturate(100%) invert(24%) sepia(12%) saturate(930%) hue-rotate(179deg)}
  #route-activity .activity-selector button{min-width:104px;height:42px;padding:0 13px}
  #route-activity .activity-selector img{width:20px;height:20px}
  #route-activity .activity-card{width:min(650px,100%);height:calc(100% - 16px);min-height:0;margin:16px auto 0;padding:22px 24px;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;border-radius:24px 24px 0 0}
  #route-activity .activity-card h2{font-size:23px}
  #route-activity .calendar-week{margin-top:18px}
  #route-activity .calendar-week,#route-activity .calendar-grid{gap:5px}
  #route-activity .calendar-grid{margin-top:7px}
  #route-activity .calendar-day{min-height:52px;padding:5px;border-radius:12px;font-size:13px}
  #route-activity .calendar-day small{margin-top:2px;font-size:8px}
  #route-activity .reward-rules{margin-top:14px}
  #route-activity .reward-rules span{padding:6px 9px;font-size:10px}
  #route-activity #activityStatus{margin-top:12px;font-size:12px}
}
@media(prefers-color-scheme:dark){.activity-selector button{color:#d7dbe4!important}.activity-selector button.active{color:#d6e3ff!important}#checkinButton:disabled{background:#244b2a!important;color:#bcecb9!important}}
@media(prefers-color-scheme:dark) and (min-width:600px){#route-activity .activity-selector img{filter:brightness(0) saturate(100%) invert(87%) sepia(9%) saturate(436%) hue-rotate(181deg)}}
@media(max-width:599px){
  #route-activity{padding-top:70px!important;padding-bottom:28px!important}
  #route-activity .activity-selector{position:fixed!important;top:72px!important;right:0;bottom:auto!important;left:0;z-index:34;height:62px;margin:0;padding:8px 10px;background:color-mix(in srgb,var(--surface-container) 96%,transparent);border-top:0;border-bottom:1px solid var(--outline-variant);box-shadow:0 2px 10px #00000012;backdrop-filter:blur(18px)}
  #route-activity .activity-selector button{height:44px;min-width:96px;padding:0 12px;background:var(--surface-high)}
  #route-activity .activity-selector button.active{background:var(--primary-container)}
  #route-activity .activity-selector img{width:20px;height:20px;filter:brightness(0) saturate(100%) invert(24%) sepia(12%) saturate(930%) hue-rotate(179deg)}
  #route-activity .calendar-week,#route-activity .calendar-grid{width:100%;grid-template-columns:repeat(7,minmax(0,1fr));column-gap:3px;row-gap:4px}
  #route-activity .calendar-week{padding:0;margin-top:18px}
  #route-activity .calendar-grid{margin-top:6px}
  #route-activity .calendar-day{width:100%;min-width:0;min-height:44px;padding:4px 1px;border-radius:10px;overflow:hidden}
  #route-activity .calendar-day small{max-width:100%;font-size:7px;overflow:hidden;text-overflow:ellipsis}
}
@media(prefers-color-scheme:dark) and (max-width:599px){#route-activity .activity-selector img{filter:brightness(0) saturate(100%) invert(87%) sepia(9%) saturate(436%) hue-rotate(181deg)}}
