.hours-displayed-3.svelte-2hlirp.svelte-2hlirp{--cgm-chart-size-10:6px;--cgm-chart-size-20:12px;--cgm-chart-size-30:24px;--cgm-chart-size-40:36px}.hours-displayed-6.svelte-2hlirp.svelte-2hlirp{--cgm-chart-size-10:3px;--cgm-chart-size-20:6px;--cgm-chart-size-30:12px;--cgm-chart-size-40:18px}.hours-displayed-12.svelte-2hlirp.svelte-2hlirp{--cgm-chart-size-10:1.5px;--cgm-chart-size-20:3px;--cgm-chart-size-30:6px;--cgm-chart-size-40:9px}.hours-displayed-24.svelte-2hlirp.svelte-2hlirp{--cgm-chart-size-10:0.75px;--cgm-chart-size-20:1.5px;--cgm-chart-size-30:3px;--cgm-chart-size-40:4.5px}main.svelte-2hlirp.svelte-2hlirp{background:var(--page-bg-color);box-sizing:border-box;min-height:100vh}.top-nav.svelte-2hlirp.svelte-2hlirp{background:var(--nav-bg-color);color:var(--nav-text-color);height:70px;position:relative}.top-right-corner.svelte-2hlirp.svelte-2hlirp{position:absolute;top:10px;right:12px}.top-right-corner.svelte-2hlirp button.svelte-2hlirp{background:transparent;border:0;color:var(--nav-text-color);cursor:pointer;display:grid;text-decoration:none;padding:8px 20px;font-size:24px}.top-right-corner.svelte-2hlirp button.svelte-2hlirp:hover{color:var(--nav-text-color-selected)}.time-row.svelte-2hlirp.svelte-2hlirp{margin:0 auto;position:relative;width:500px}.current-time.svelte-2hlirp.svelte-2hlirp{font-weight:var(--bold-weight);left:10px;top:0;position:absolute}.time-controls.svelte-2hlirp.svelte-2hlirp{position:absolute;top:4px;right:-14px;width:220px}.time-controls.svelte-2hlirp div.increase{width:40px;right:-40px;font-size:16px}.time-controls.svelte-2hlirp div.decrease{width:40px;left:-40px;font-size:16px}.game-title.svelte-2hlirp.svelte-2hlirp{position:absolute;top:24px;left:26px}.game-title.svelte-2hlirp h1.svelte-2hlirp{cursor:pointer;margin:0;font-size:20px}.game-title.svelte-2hlirp h1 span.svelte-2hlirp{font-weight:var(--regular-weight)}.game-title.svelte-2hlirp h1.svelte-2hlirp svg{opacity:0.5;position:relative;top:2px;margin:0 5px 0 0}.game-title.svelte-2hlirp h1.svelte-2hlirp:hover svg{opacity:1}.speed-control.svelte-2hlirp.svelte-2hlirp{width:80px;position:relative;top:-6px;margin:0 20px;height:50px}.phone.svelte-2hlirp.svelte-2hlirp{border-radius:18px;padding:34px 20px 48px 10px;box-shadow:0 2px 4px var(--drop-shadow);background:var(--card-bg-color);width:500px;margin:40px auto 0;position:relative}.pump-status.svelte-2hlirp.svelte-2hlirp{display:grid;grid-template-columns:1fr 1fr;margin:0 auto;position:relative;top:14px;width:500px}.pump-status.svelte-2hlirp .badge.svelte-2hlirp{font-size:14px;color:var(--text-color-dull)}.pump-status.svelte-2hlirp .badge strong.svelte-2hlirp{color:var(--text-color)}.pump-status.svelte-2hlirp .badge.iob.svelte-2hlirp{margin-left:12px}.pump-status.svelte-2hlirp .badge.cob.svelte-2hlirp{text-align:right;margin-right:12px}.debug-panel.svelte-2hlirp.svelte-2hlirp{background:var(--card-bg-color);box-shadow:0 4px 18px var(--drop-shadow);box-sizing:border-box;position:fixed;bottom:10px;left:10px;padding:28px;width:240px}.center-column.svelte-2hlirp.svelte-2hlirp{padding:32px 40px}.current-bg.svelte-2hlirp.svelte-2hlirp{margin:0 auto 28px;text-align:center}.current-bg.svelte-2hlirp h2.svelte-2hlirp{font-size:60px;line-height:60px;margin:0}.current-bg.sensor-error.svelte-2hlirp h2.svelte-2hlirp{font-size:40px}.trend-arrow.svelte-2hlirp.svelte-2hlirp{position:absolute;right:165px;top:47px}h2.hypoglycemic.svelte-2hlirp.svelte-2hlirp{color:var(--hypo-text-color)}h2.hyperglycemic.svelte-2hlirp.svelte-2hlirp{color:var(--hyper-text-color)}.current-bg.svelte-2hlirp h3.svelte-2hlirp{color:var(--text-color-dull);font-size:18px;font-weight:var(--regular-weight);line-height:18px;margin:6px 0 0}.cgm-chart-controls.svelte-2hlirp.svelte-2hlirp{display:grid;grid-auto-flow:column;justify-content:center;grid-gap:2px;margin:0 0 8px}.cgm-chart.svelte-2hlirp.svelte-2hlirp{background:var(--card-bg-color);height:160px;margin:0 auto;position:relative;width:432px}.chart-frame.svelte-2hlirp.svelte-2hlirp{position:absolute;height:100%;width:100%}.y-annotation.svelte-2hlirp.svelte-2hlirp{position:absolute;right:-50px;font-size:12px;line-height:0px;width:42px;height:0px;text-align:left;margin-top:-1px}.x-annotation.svelte-2hlirp.svelte-2hlirp{position:absolute;bottom:-24px;font-size:12px;text-align:center;width:80px;margin:0 0 0 -40px}.emoji-parent.svelte-2hlirp.svelte-2hlirp{margin:0;text-align:center;position:absolute;top:0;right:-10px;height:24px;width:24px}.emoji-parent.svelte-2hlirp .emoji.svelte-2hlirp{font-size:24px;line-height:24px;position:relative;top:-12px}.dot-parent.svelte-2hlirp.svelte-2hlirp{display:inline-block;height:calc(100% - 2px);width:var(--cgm-chart-size-20);position:relative}.dot.svelte-2hlirp.svelte-2hlirp{background:var(--text-color-bright);position:absolute;left:calc(var(--cgm-chart-size-10) - 2px);border-radius:50%;width:4px;height:4px}.high-bg.svelte-2hlirp.svelte-2hlirp{position:absolute;width:100%;height:41%;top:0;background:var(--high-bg-area-color);box-shadow:0 2px 0 var(--high-bg-area-border-color)}.in-range-bg.svelte-2hlirp.svelte-2hlirp{position:absolute;width:100%;height:31%;top:61%;background:var(--in-range-bg-area-color)}.low-bg.svelte-2hlirp.svelte-2hlirp{position:absolute;background:var(--low-bg-area-color);box-shadow:0 -2px 0 var(--low-bg-area-border-color);width:100%;height:8%;top:92%}.actions.svelte-2hlirp.svelte-2hlirp{border:1px solid var(--border-color-dull);border-radius:8px;padding:20px 24px;margin:60px 0 60px;display:grid;grid-gap:18px;grid-auto-flow:column}.actions.svelte-2hlirp .button{margin-bottom:6px}.actions.svelte-2hlirp h3.svelte-2hlirp{font-size:14px;margin:0 0 6px}.action-label.svelte-2hlirp.svelte-2hlirp{font-size:12px;line-height:12px;position:relative;min-width:46px;padding-top:20px;text-align:left}.action-label.svelte-2hlirp .amount.svelte-2hlirp{position:absolute;top:-2px;right:-6px;font-size:12px;font-weight:var(--regular-weight);color:var(--text-color-dull)}.action-label.svelte-2hlirp .emoji.svelte-2hlirp{position:absolute;top:0px;left:-2px;font-size:14px;line-height:100%;margin:0 0 4px}@media(max-width: 520px){.hours-displayed-3.svelte-2hlirp.svelte-2hlirp{--cgm-chart-size-10:4px;--cgm-chart-size-20:8px;--cgm-chart-size-30:12px;--cgm-chart-size-40:16px}.hours-displayed-6.svelte-2hlirp.svelte-2hlirp{--cgm-chart-size-10:2px;--cgm-chart-size-20:4px;--cgm-chart-size-30:6px;--cgm-chart-size-40:8px}.hours-displayed-12.svelte-2hlirp.svelte-2hlirp{--cgm-chart-size-10:1px;--cgm-chart-size-20:2px;--cgm-chart-size-30:3px;--cgm-chart-size-40:4px}.hours-displayed-24.svelte-2hlirp.svelte-2hlirp{--cgm-chart-size-10:0.5px;--cgm-chart-size-20:1px;--cgm-chart-size-30:1.5px;--cgm-chart-size-40:2px}.center-column.svelte-2hlirp.svelte-2hlirp{padding:32px 0}.cgm-chart.svelte-2hlirp.svelte-2hlirp{height:140px;width:300px}.cgm-chart-controls.svelte-2hlirp button.button.wide{padding-left:20px;padding-right:20px}.phone.svelte-2hlirp.svelte-2hlirp{padding:36px 18px 40px 0px;width:340px}.pump-status.svelte-2hlirp.svelte-2hlirp{width:340px}.time-row.svelte-2hlirp.svelte-2hlirp{width:340px}.current-bg.sensor-error.svelte-2hlirp h2.svelte-2hlirp{font-size:32px}.current-bg.svelte-2hlirp h2.svelte-2hlirp,.current-bg.svelte-2hlirp h3.svelte-2hlirp{margin-right:-18px}.trend-arrow.svelte-2hlirp.svelte-2hlirp{right:76px}}html {
  /* base hues */
  --red-hue: 355;
  --orange-hue: 25;
  --yellow-hue: 50;
  --green-hue: 89;
  --blue-hue: 202;
  --dark-blue-hue: 220;
  --purple-hue: 285;

  /* z-indexes */
  --z-modal-dialog-backdrop: 99;
  --z-modal-dialogs: 100;
  --z-dropdowns: 110;
  --z-toasts: 120;
  --z-tooltips: 130;

  --z-ios-nav: 10;
  --z-ios-header: 99999;

  /* weights */
  --regular-weight: 400;
  --bold-weight: 600;
}

html.theme-light {
  --html-bg-color: #000;
  --page-bg-color: hsl(var(--yellow-hue), 6%, 94%);
  --dialog-bg-color: hsl(var(--yellow-hue), 12%, 92%);

  --ios-header-bg-color: #000;

  --nav-bg-color: hsl(var(--green-hue), 60%, 18%);
  --nav-bg-color-selected: hsl(var(--green-hue), 65%, 22%);
  --nav-text-color: hsl(var(--green-hue), 50%, 80%);
  --nav-text-color-selected: #fff;

  --loading-spinner-background: rgba(0, 0, 0, 0.1);
  --loading-spinner-color: rgba(0, 0, 0, 0.9);

  --input-bg-color: rgba(255, 255, 255, 0.6);
  --input-bg-color-focus: rgba(255, 255, 255, 0.8);
  --input-border-color: rgba(255, 255, 255, 0.12);
  --input-border-hover: rgba(255, 255, 255, 0.4);
  --input-border-focus: hsl(var(--blue-hue), 100%, 60%);

  --radio-button-bg: #fff;

  --text-color: #333;
  --text-color-dull: #707070;
  --text-color-very-dull: #888;
  --text-color-bright: #111;
  --text-highlighted-bg: hsl(var(--yellow-hue), 90%, 80%);
  --text-highlighted-color: #111;
  --text-allergy-color: hsl(var(--red-hue), 100%, 40%);

  --tag-bg: hsl(var(--yellow-hue), 40%, 92%);
  --tag-bg-brand: hsl(var(--blue-hue), 60%, 92%);

  --link-color: hsl(var(--blue-hue), 50%, 40%);
  --link-underline-color: hsl(var(--blue-hue), 60%, 65%);
  --link-color-hover: hsl(var(--blue-hue), 70%, 40%);

  --placeholder-color: #ccc;

  --border-color: #bbb;
  --border-color-dull: #ddd;
  --border-color-bright: #777;

  --button-bg-color: rgba(0, 0, 0, 0.08);
  --button-bg-color-hover: rgba(255, 255, 255, 0.5);
  --button-bg-color-active: rgba(0, 0, 0, 0.14);
  --button-text-color-active: #111;

  --button-input-like-bg-color: rgba(255, 255, 255, 0.3);

  --button-primary-bg-color: hsl(var(--green-hue), 60%, 38%);
  --button-primary-bg-color-hover: hsl(var(--green-hue), 60%, 42%);
  --button-primary-bg-color-active: #444;
  --button-primary-text-color: #fff;
  --button-primary-text-color-active: #fff;

  --button-alert-bg-color: hsl(var(--yellow-hue), 75%, 38%);
  --button-alert-bg-color-hover: hsl(var(--yellow-hue), 75%, 42%);
  --button-alert-bg-color-active: hsl(var(--yellow-hue), 75%, 38%);
  --button-alert-text-color: #fff;
  --button-alert-text-color-active: #fff;

  --login-card-bg-color: #eee;

  --list-item-hover: #e1effb;

  --drop-shadow-bright: rgba(0, 0, 0, 0.14);
  --drop-shadow: rgba(0, 0, 0, 0.14);
  --drop-shadow-dull: rgba(0, 0, 0, 0.08);

  --flash-text-color: #fff;
  --flash-error-bg-color: hsl(var(--red-hue), 70%, 40%);
  --flash-info-bg-color: hsl(var(--blue-hue), 50%, 45%);
  --flash-success-bg-color: hsl(var(--green-hue), 90%, 30%);

  --tooltip-bg-color: #333;
  --tooltip-text-color: #eee;

  --dropdown-bg-color: #fafafa;
  --dropdown-hover-item-bg-color: #eee;
  --dropdown-selected-item-bg-color: hsl(var(--blue-hue), 65%, 92%);

  --badge-yellow-bg-color: hsl(var(--yellow-hue), 80%, 100%);
  --badge-yellow-text-color: hsl(var(--yellow-hue), 60%, 25%);
  --badge-green-bg-color: hsla(var(--green-hue), 80%, 65%, 0.3);
  --badge-green-text-color: hsl(var(--green-hue), 50%, 30%);
  --badge-red-bg-color: hsla(var(--red-hue), 80%, 65%, 0.3);
  --badge-red-text-color: hsl(var(--red-hue), 50%, 30%);
  --badge-blue-bg-color: hsla(var(--blue-hue), 80%, 65%, 0.15);
  --badge-blue-text-color: hsl(var(--blue-hue), 60%, 40%);

  --card-bg-color: rgba(255, 255, 255, 0.6);
  --card-dull-bg-color: rgba(255, 255, 255, 0.35);

  --food-list-hover: rgba(255, 255, 255, 0.5);

  --toast-bg-error: hsl(var(--red-hue), 60%, 92%);
  --toast-color-error: hsl(var(--red-hue), 50%, 40%);
  --toast-bg-alert: hsl(var(--yellow-hue), 60%, 92%);
  --toast-color-alert: hsl(var(--yellow-hue), 50%, 35%);
  --toast-bg-success: hsl(var(--green-hue), 60%, 92%);
  --toast-color-success: hsl(var(--green-hue), 50%, 30%);
  --toast-bg-info: hsl(var(--blue-hue), 60%, 92%);
  --toast-color-info: hsl(var(--blue-hue), 50%, 40%);
  --toast-sidebar-bg: rgba(255, 255, 255, 0.4);

  --homepage-header-bg: rgba(255, 255, 255, 0.6);
  --homepage-meal-tracking-bg: hsla(var(--blue-hue), 70%, 75%, 30%);
  --homepage-nutritional-reporting-bg: hsla(var(--yellow-hue), 70%, 65%, 30%);
  --homepage-diabetes-reporting-bg: hsla(var(--purple-hue), 20%, 80%, 30%);
  --homepage-footer-bg: hsl(var(--blue-hue), 15%, 90%);

  --message-info-bg-color: hsl(var(--blue-hue), 60%, 94%);
  --message-info-text-color: hsl(var(--blue-hue), 85%, 20%);

  --message-alert-bg-color: hsl(var(--yellow-hue), 90%, 92%);
  --message-alert-text-color: hsl(var(--yellow-hue), 60%, 20%);

  --calendar-box-bg-color: hsl(var(--green-hue), 60%, 90%);

  --glucose-dot-color: hsl(var(--green-hue), 30%, 45%);
  --glucose-chart-area-green: hsla(var(--green-hue), 60%, 60%, 0.15);
  --glucose-chart-label-bg-color: #fff;
  --glucose-chart-meal-label-color: hsl(var(--green-hue), 70%, 40%);
  --glucose-chart-bolus-label-color: hsl(var(--purple-hue), 80%, 65%);

  --pie-chart-border: rgba(255, 255, 255, 0.6);

  --chart-bg-color: rgba(255, 255, 255, 0.8);
  --chart-annotation-bg-color: rgba(0, 0, 0, 0.1);
  --chart-avg-line: rgba(0, 0, 0, 0.8);

  --chart-color-light-gray: rgba(0, 0, 0, 0.07);
  --chart-color-gray: rgb(120, 120, 120);
  --chart-color-red: hsl(var(--red-hue), 70%, 55%);
  --chart-color-orange: hsl(var(--orange-hue), 80%, 50%);
  --chart-color-yellow: hsl(var(--yellow-hue), 80%, 50%);
  --chart-color-yellow-text: hsl(var(--yellow-hue), 80%, 38%);
  --chart-color-green: hsl(var(--green-hue), 65%, 40%);
  --chart-color-blue: hsl(var(--blue-hue), 70%, 50%);
  --chart-color-dark-blue: hsl(var(--dark-blue-hue), 70%, 40%);
  --chart-color-purple: hsl(var(--purple-hue), 50%, 60%);
  --chart-color-brown: hsl(var(--orange-hue), 50%, 20%);
  --chart-color-brown-text: hsl(var(--orange-hue), 50%, 20%);

  --did-you-know-bg: hsl(var(--blue-hue), 12%, 90%);
}

html.theme-dark {
  --html-bg-color: #000;
  --page-bg-color: hsl(var(--blue-hue), 10%, 10%);
  --dialog-bg-color: hsl(var(--blue-hue), 10%, 12%);

  --ios-header-bg-color: #000;

  --loading-spinner-background: rgba(255, 255, 255, 0.1);
  --loading-spinner-color: rgba(255, 255, 255, 0.7);

  --input-bg-color: rgba(0, 0, 0, 0.3);
  --input-bg-color-focus: rgba(0, 0, 0, 0.5);
  --input-border-color: rgba(0, 0, 0, 0.1);
  --input-border-hover: rgba(0, 0, 0, 0.3);
  --input-border-focus: hsl(var(--blue-hue), 100%, 50%);

  --radio-button-bg: #000;

  --tag-bg: hsl(var(--yellow-hue), 20%, 20%);
  --tag-bg-brand: hsl(var(--blue-hue), 60%, 20%);

  --text-color: rgba(255, 255, 255, 0.9);
  --text-color-dull: rgba(255, 255, 255, 0.55);
  --text-color-very-dull: rgba(255, 255, 255, 0.5);
  --text-color-bright: #fafafa;
  --text-highlighted-bg: hsl(var(--yellow-hue), 50%, 25%);
  --text-highlighted-color: #fafafa;
  --text-allergy-color: hsl(var(--red-hue), 100%, 68%);

  --placeholder-color: rgba(255, 255, 255, 0.3);

  --link-color: hsl(var(--blue-hue), 80%, 70%);
  --link-underline-color: hsl(var(--blue-hue), 40%, 50%);
  --link-color-hover: hsl(var(--blue-hue), 80%, 85%);

  --border-color: rgba(255, 255, 255, 0.35);
  --border-color-dull: rgba(255, 255, 255, 0.15);
  --border-color-bright: rgba(255, 255, 255, 0.7);

  --button-bg-color: rgba(255, 255, 255, 0.16);
  --button-bg-color-hover: rgba(255, 255, 255, 0.25);
  --button-bg-color-active: rgba(255, 255, 255, 0.1);
  --button-text-color-active: #fff;

  --button-input-like-bg-color: rgba(255, 255, 255, 0.1);

  --button-primary-bg-color: hsl(var(--green-hue), 60%, 32%);
  --button-primary-bg-color-hover: hsl(var(--green-hue), 60%, 40%);
  --button-primary-bg-color-active: rgba(255, 255, 255, 0.4);
  --button-primary-text-color: #fff;
  --button-primary-text-color-active: #fff;

  --button-alert-bg-color: hsl(var(--yellow-hue), 60%, 32%);
  --button-alert-bg-color-hover: hsl(var(--yellow-hue), 60%, 40%);
  --button-alert-bg-color-active: rgba(255, 255, 255, 0.4);
  --button-alert-text-color: #fff;
  --button-alert-text-color-active: #fff;

  --dropdown-bg-color: #393939;
  --dropdown-hover-item-bg-color: rgba(255, 255, 255, 0.15);
  --dropdown-selected-item-bg-color: hsl(var(--blue-hue), 60%, 35%);

  --flash-text-color: #fff;
  --flash-error-bg-color: hsl(var(--red-hue), 70%, 40%);
  --flash-info-bg-color: hsl(var(--blue-hue), 50%, 45%);
  --flash-success-bg-color: hsl(var(--green-hue), 90%, 30%);

  --login-card-bg-color: #333;

  --nav-bg-color: #131517;
  --nav-bg-color-selected: rgba(255, 255, 255, 0.05);
  --nav-text-color: rgba(255, 255, 255, 0.7);
  --nav-text-color-selected: #fff;

  --list-item-hover: #263949;

  --drop-shadow-bright: rgba(0, 0, 0, 0.5);
  --drop-shadow: rgba(0, 0, 0, 0.3);
  --drop-shadow-dull: rgba(0, 0, 0, 0.15);

  --tooltip-bg-color: #eee;
  --tooltip-text-color: #333;

  --badge-yellow-bg-color: hsl(var(--yellow-hue), 70%, 25%);
  --badge-yellow-text-color: hsl(var(--yellow-hue), 50%, 75%);
  --badge-green-bg-color: hsl(var(--green-hue), 70%, 25%);
  --badge-green-text-color: hsl(var(--green-hue), 50%, 75%);
  --badge-red-bg-color: hsl(var(--red-hue), 70%, 25%);
  --badge-red-text-color: hsl(var(--red-hue), 50%, 75%);
  --badge-blue-bg-color: hsla(var(--blue-hue), 80%, 75%, 25%);
  --badge-blue-text-color: hsl(var(--blue-hue), 60%, 75%);

  --card-bg-color: rgba(255, 255, 255, 0.06);
  --card-dull-bg-color: rgba(255, 255, 255, 0.03);

  --food-list-hover: rgba(255, 255, 255, 0.1);

  --toast-bg-error: hsl(var(--red-hue), 50%, 20%);
  --toast-color-error: hsl(var(--red-hue), 50%, 80%);
  --toast-bg-alert: hsl(var(--yellow-hue), 80%, 20%);
  --toast-color-alert: hsl(var(--yellow-hue), 50%, 70%);
  --toast-bg-success: hsl(var(--green-hue), 70%, 20%);
  --toast-color-success: hsl(var(--green-hue), 50%, 70%);
  --toast-bg-info: hsl(var(--blue-hue), 70%, 22%);
  --toast-color-info: hsl(var(--blue-hue), 20%, 75%);
  --toast-sidebar-bg: rgba(0, 0, 0, 0.2);

  --homepage-header-bg: #0f0f0f;
  --homepage-meal-tracking-bg: hsla(var(--blue-hue), 50%, 40%, 30%);
  --homepage-nutritional-reporting-bg: hsla(var(--orange-hue), 50%, 42%, 30%);
  --homepage-diabetes-reporting-bg: hsla(var(--purple-hue), 50%, 42%, 36%);
  --homepage-footer-bg: #0f0f0f;

  --message-info-bg-color: var(--card-bg-color);
  --message-info-text-color: rgba(255, 255, 255, 0.8);

  --message-alert-bg-color: var(--card-bg-color);
  --message-alert-text-color: rgba(255, 255, 255, 0.8);

  --calendar-box-bg-color: hsl(var(--green-hue), 60%, 5%);

  --glucose-dot-color: hsl(var(--green-hue), 50%, 70%);
  --glucose-chart-area-green: hsla(var(--green-hue), 80%, 50%, 0.05);
  --glucose-chart-label-bg-color: #505050;
  --glucose-chart-meal-label-color: hsl(var(--green-hue), 90%, 85%);
  --glucose-chart-bolus-label-color: hsl(var(--purple-hue), 90%, 85%);

  --pie-chart-border: rgba(255, 255, 255, 0.15);

  --chart-bg-color: rgba(255, 255, 255, 0.06);
  --chart-annotation-bg-color: rgba(255, 255, 255, 0.2);
  --chart-avg-line: rgba(255, 255, 255, 0.1);

  --chart-color-light-gray: rgba(255, 255, 255, 0.1);
  --chart-color-gray: rgb(100, 100, 100);
  --chart-color-red: hsl(var(--red-hue), 70%, 55%);
  --chart-color-orange: hsl(var(--orange-hue), 80%, 50%);
  --chart-color-yellow: hsl(var(--yellow-hue), 80%, 50%);
  --chart-color-yellow-text: hsl(var(--yellow-hue), 80%, 50%);
  --chart-color-green: hsl(var(--green-hue), 65%, 40%);
  --chart-color-blue: hsl(var(--blue-hue), 70%, 50%);
  --chart-color-dark-blue: hsl(var(--dark-blue-hue), 70%, 40%);
  --chart-color-purple: hsl(var(--purple-hue), 50%, 55%);
  --chart-color-brown: hsl(var(--orange-hue), 40%, 35%);
  --chart-color-brown-text: hsl(var(--orange-hue), 40%, 45%);

  --did-you-know-bg: hsl(var(--blue-hue), 15%, 15%);
}

html {
  /* Prevent font scaling in landscape while allowing user zoom */
  /* Ref: https://stackoverflow.com/a/2711132/440094 */
  -webkit-text-size-adjust: 100%;
}

body, html {
  margin: 0;
  padding: 0;
  background: var(--html-bg-color);
}

html.app-ui, .app-ui body {
  /* Hiding page scrollbar: https://stackoverflow.com/a/49278385/440094 */
  scrollbar-width: none;
}

html.app-ui ::-webkit-scrollbar {
  /* Webkit, Chrome */
  display: none;
}

html.barcode-scanner-active body {
  background: transparent !important;
  display: none;
  opacity: 0;
}

::placeholder {
  color: var(--placeholder-color);
}

body {
  padding-top: env(safe-area-inset-top, 0px);
  color: var(--text-color);
  min-height: 100vh;
}

body, html, select, input, textarea, button {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
  font-weight: var(--regular-weight);
  font-size: 16px;
  line-height: 140%;
}

a, input, textarea, button {
  border-style: unset;
}

h1, h2, h3, h4 {
  font-weight: var(--bold-weight);
}

a, a:hover, a:focus, a:active, button, label, input {
  -webkit-tap-highlight-color: transparent;
}

a {
  color: var(--link-color);
  text-decoration: none;
  word-break: break-word;
}

a:hover, a:focus {
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: var(--link-underline-color);
  text-decoration-thickness: 1px;
}

a:hover {
  color: var(--link-color-hover);
}

/* Hide the up/down arrows for number type inputs */
/* Ref: https://stackoverflow.com/a/4298216/440094 */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  /* display: none; <- Crashes Chrome on hover */
  -webkit-appearance: none;
  margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

input[type=number] {
  appearance: textfield;
  -moz-appearance: textfield; /* Firefox */
}

button {
  cursor: pointer;
  margin: 0;
}

.has-saltdown h3 {
  margin: 14px 0 7px;
  font-size: 17px;
}

.has-saltdown h3:first-child {
  margin-top: 7px;
}

.has-saltdown p {
  font-size: 17px;
  line-height: 135%;
  margin: 7px 0;
}

input {
  margin: 0;
}

ol, ul {
  margin: 8px 0 12px;
  padding: 0 0 0 24px;
}

li {
  padding: 5px 2px;
  margin: 0;
  font-size: 17px;
  line-height: 140%;
}

li:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

table {
  border-spacing: 0;
  width: 100%;
}

th {
  padding: 8px 14px 8px 0;
  text-align: left;
}

td {
  border-top: 1px solid var(--border-color-dull);
  padding: 8px 14px 8px 0;
}

.screen-reader-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border-width: 0;
}

/* Global because it's added/removed outside of Svelte. */
.draggable-drop-target {
  opacity: 0.5;
}

html.theme-light {
  --message-overlay-bg: rgba(60, 60, 60, 0.9);

  --high-bg-area-color: hsla(var(--yellow-hue), 60%, 80%, 0.3);
  --in-range-bg-area-color: hsla(var(--green-hue), 60%, 80%, 0.5);
  --low-bg-area-color: hsla(var(--red-hue), 60%, 80%, 0.3);

  --high-bg-area-border-color: hsla(var(--yellow-hue), 90%, 60%, 0.6);
  --low-bg-area-border-color: hsla(var(--red-hue), 90%, 60%, 0.6);

  --hyper-text-color: hsl(var(--yellow-hue), 95%, 45%);
  --hypo-text-color: hsl(var(--red-hue), 90%, 40%);
}

html.theme-dark {
  --message-overlay-bg: rgba(0, 0, 0, 0.9);

  --high-bg-area-color: hsla(var(--yellow-hue), 60%, 25%, 0.3);
  --in-range-bg-area-color: hsla(var(--green-hue), 60%, 25%, 0.5);
  --low-bg-area-color: hsla(var(--red-hue), 60%, 25%, 0.3);

  --high-bg-area-border-color: hsla(var(--yellow-hue), 80%, 50%, 0.5);
  --low-bg-area-border-color: hsla(var(--red-hue), 80%, 50%, 0.5);

  --hyper-text-color: hsl(var(--yellow-hue), 95%, 50%);
  --hypo-text-color: hsl(var(--red-hue), 90%, 60%);
}

html, body {
  background: var(--page-bg-color);
}
.button.svelte-1jetnuu.svelte-1jetnuu{background:var(--button-bg-color);border-radius:4px;border:0;color:var(--text-color);cursor:pointer;display:inline-grid;padding:10px 16px;font-size:15px;font-weight:var(--bold-weight);line-height:20px;outline:none;text-decoration:none;transition:transform 100ms ease, background-color 180ms ease;width:fit-content;grid-gap:4px;grid-auto-flow:column;align-items:center;user-select:none}.button.svelte-1jetnuu svg{stroke:var(--text-color)}.button.has-add-on.svelte-1jetnuu.svelte-1jetnuu{border-radius:4px 0 0 4px}.button.add-on.svelte-1jetnuu.svelte-1jetnuu{border-radius:0 4px 4px 0;margin-left:-9px;padding:10px 11px}.button.delete.svelte-1jetnuu.svelte-1jetnuu{background:none;opacity:0.5}.button.small.svelte-1jetnuu.svelte-1jetnuu{padding:5px 12px 6px;font-size:14px}.button.delete.faded.svelte-1jetnuu.svelte-1jetnuu{opacity:0.3}.button.input-like.svelte-1jetnuu.svelte-1jetnuu{background:var(--button-input-like-bg-color);padding:5px 0 6px;font-size:12px;width:32px}.button.border-only.svelte-1jetnuu.svelte-1jetnuu{background:none;border:1px solid var(--border-color-dull);padding-top:9px;padding-bottom:9px}.button.primary.svelte-1jetnuu.svelte-1jetnuu{background:var(--button-primary-bg-color);color:var(--button-primary-text-color)}.button.alert.svelte-1jetnuu.svelte-1jetnuu{background:var(--button-alert-bg-color);color:var(--button-alert-text-color)}.button.no-background.svelte-1jetnuu.svelte-1jetnuu{background:none;box-shadow:none}.button.disabled.svelte-1jetnuu.svelte-1jetnuu{background:var(--button-bg-color) !important;box-shadow:0 0 0 1px var(--border-color-dull) inset !important;color:var(--button-text-color);opacity:0.4;cursor:inherit;pointer-events:none}.button.wide.svelte-1jetnuu.svelte-1jetnuu{padding-left:30px;padding-right:30px}.is-saving.svelte-1jetnuu.svelte-1jetnuu{opacity:0.8;cursor:inherit;position:relative;pointer-events:none}.spinner.svelte-1jetnuu.svelte-1jetnuu{height:100%;left:0;position:absolute;top:0;width:100%;text-align:center;display:grid;align-content:center;justify-content:center}.button.svelte-1jetnuu .spinner.svelte-1jetnuu svg{stroke:none}.hide.svelte-1jetnuu.svelte-1jetnuu{opacity:0}.button.svelte-1jetnuu.svelte-1jetnuu:hover,.button.svelte-1jetnuu.svelte-1jetnuu:focus{background:var(--button-bg-color-hover);box-shadow:0 -1px 0 rgba(0, 0, 0, 0.2) inset}.button.svelte-1jetnuu.svelte-1jetnuu:active{background:var(--button-bg-color-active);box-shadow:none;color:var(--button-text-color-active);text-decoration:none;transform:scale(0.97)}.button.primary.svelte-1jetnuu.svelte-1jetnuu:hover,.button.primary.svelte-1jetnuu.svelte-1jetnuu:focus{background:var(--button-primary-bg-color-hover)}.button.primary.svelte-1jetnuu.svelte-1jetnuu:active{background:var(--button-primary-bg-color-active);color:var(--button-primary-text-color-active)}.button.alert.svelte-1jetnuu.svelte-1jetnuu:hover,.button.alert.svelte-1jetnuu.svelte-1jetnuu:focus{background:var(--button-alert-bg-color-hover)}.button.alert.svelte-1jetnuu.svelte-1jetnuu:active{background:var(--button-alert-bg-color-active);color:var(--button-alert-text-color-active)}.button.svelte-1jetnuu .icon-square{margin-right:2px;opacity:0.5}.button.svelte-1jetnuu .icon-check-square{margin-right:2px;stroke:var(--link-color)}.button.svelte-1jetnuu .icon-chevron-down{opacity:0.5}.button.primary.svelte-1jetnuu .icon-chevron-down{stroke:var(--button-primary-text-color);fill:var(--button-primary-text-color);opacity:1}.stat-group.svelte-19p8q8o.svelte-19p8q8o{display:grid;grid-template-columns:1fr 1fr;grid-gap:20px;margin:20px 0}.stat-group.svelte-19p8q8o .stat.svelte-19p8q8o{background:var(--card-bg-color);border-radius:4px;box-shadow:0 1px 2px var(--drop-shadow);font-size:24px;line-height:140%;font-weight:var(--bold-weight);padding:12px 18px 10px;position:relative}.stat.svelte-19p8q8o .stat-name.svelte-19p8q8o{font-size:14px;font-weight:var(--regular-weight);color:var(--text-color-dull);line-height:100%;display:block;margin:0}.stat-badge.svelte-19p8q8o.svelte-19p8q8o{position:absolute;top:-6px;right:4px}p.svelte-v5rwsu{color:var(--text-color)}.row.svelte-u33di9.svelte-u33di9{margin:6px 0 0}.label.svelte-u33di9.svelte-u33di9{font-weight:var(--bold-weight);margin:20px 0 6px;font-size:16px}button.svelte-u33di9.svelte-u33di9{border-radius:8px;background:var(--card-dull-bg-color);color:var(--text-color-bright);font-weight:var(--bold-weight);width:100%;margin:4px 0;padding:12px 16px 12px 40px;text-align:left;border:0;position:relative}button.disabled.svelte-u33di9.svelte-u33di9{cursor:default;pointer-events:none;opacity:0.35}button.selected.svelte-u33di9.svelte-u33di9{background:var(--card-bg-color);box-shadow:0 0 1px 2px var(--input-border-focus)}button.svelte-u33di9 .radio.svelte-u33di9{left:14px;position:absolute;top:14px}button.svelte-u33di9 .radio div.svelte-u33di9{display:none}button.selected.svelte-u33di9 .radio div.selected.svelte-u33di9{display:block}.note.svelte-u33di9.svelte-u33di9{color:var(--text-color-dull);font-size:15px;font-weight:var(--regular-weight);line-height:20px}.message-overlay.svelte-9jonzh{background:var(--message-overlay-bg);position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:var(--z-modal-dialog-backdrop)}.message-parent.svelte-9jonzh{position:absolute;z-index:var(--z-modal-dialogs);display:grid;justify-items:center;left:0;width:100vw}.message-parent.align-center.svelte-9jonzh{align-items:center;top:0;height:100vh}.message-parent.align-top.svelte-9jonzh{align-items:start;top:24px}.message-dialog.svelte-9jonzh{background:var(--dialog-bg-color);box-shadow:0 2px 16px rgba(0, 0, 0, 0.4);box-sizing:border-box;border-radius:16px;color:var(--text-color);padding:34px 38px;position:relative;width:460px}.message-dialog.wide.svelte-9jonzh{width:580px;max-width:calc(100vw - 20px)}.message-emoji.svelte-9jonzh{font-size:64px;text-align:center;line-height:100%;margin:0 0 12px}.message-text.svelte-9jonzh{font-size:18px;line-height:130%;font-weight:var(--bold-weight);text-align:center}.message-note.svelte-9jonzh{color:var(--text-color);font-size:14px;line-height:140%;margin:8px 0 12px}.message-actions.svelte-9jonzh{margin:20px 0 0;text-align:center}@media(max-width: 520px){.message-dialog.svelte-9jonzh{padding:24px 28px;width:calc(100% - 20px)}.message-parent.align-top.svelte-9jonzh{top:10px}}.mock-correction-form.svelte-1b686dj.svelte-1b686dj{display:grid;grid-gap:12px}h3.svelte-1b686dj.svelte-1b686dj{font-size:18px;margin:2px 0 6px;text-align:center}.row.has-space.svelte-1b686dj.svelte-1b686dj{margin-bottom:6px}.calculations.svelte-1b686dj.svelte-1b686dj{margin-bottom:18px}.calc-row.svelte-1b686dj.svelte-1b686dj{display:grid;grid-template-columns:158px 30px 1fr;margin:0;padding:0}.calc-row.svelte-1b686dj .cell.svelte-1b686dj{font-size:14px;color:var(--text-color-dull);font-weight:var(--regular-weight);margin:0;padding:5px 0;text-align:left}.calc-row.svelte-1b686dj .equation.svelte-1b686dj{opacity:0.5;text-align:center}.calc-row.svelte-1b686dj .cell.is-equals.svelte-1b686dj{border-top:1px solid var(--border-color-dull);color:var(--text-color);font-weight:var(--bold-weight)}.warning.svelte-1b686dj.svelte-1b686dj{color:red;font-size:13px;text-align:center}.mock-meal-form.svelte-1c23n1h.svelte-1c23n1h{display:grid;grid-gap:12px}h3.svelte-1c23n1h.svelte-1c23n1h{font-size:18px;margin:2px 0 6px;text-align:center}.food-options.svelte-1c23n1h.svelte-1c23n1h{display:grid;grid-gap:8px 0}.calculations.svelte-1c23n1h.svelte-1c23n1h{margin-bottom:12px}.calc-row.svelte-1c23n1h.svelte-1c23n1h{display:grid;grid-template-columns:158px 30px 1fr;margin:0;padding:0}.calc-row.svelte-1c23n1h .cell.svelte-1c23n1h{font-size:14px;color:var(--text-color-dull);font-weight:var(--regular-weight);margin:0;padding:5px 0;text-align:left}.calc-row.svelte-1c23n1h .equation.svelte-1c23n1h{opacity:0.5;text-align:center}.row.has-space.svelte-1c23n1h.svelte-1c23n1h{margin-bottom:6px}.page.hidden.svelte-msh0e4{display:none}.row.svelte-msh0e4{margin:6px 0 0}.textfield.svelte-v08qz1.svelte-v08qz1{text-align:left}.textfield.has-label.svelte-v08qz1.svelte-v08qz1{display:grid;justify-items:stretch;grid-template-columns:70px auto;align-items:center}.input-button-parent.svelte-v08qz1.svelte-v08qz1{display:block}.input-button-parent.has-buttons.svelte-v08qz1.svelte-v08qz1{display:grid;grid-template-columns:32px 32px 1fr;grid-gap:1px}.pseudo-input.svelte-v08qz1.svelte-v08qz1{background:var(--page-bg-color);border:none;border-radius:5px;color:var(--text-color-dull);font-size:18px;padding:8px 10px}label.svelte-v08qz1.svelte-v08qz1{color:var(--text-color-dull);font-size:14px;line-height:150%}.slider-parent.svelte-v08qz1.svelte-v08qz1{top:-8px;position:relative}.slider-parent.has-label.svelte-v08qz1.svelte-v08qz1{padding-left:70px}.autocomplete-parent.svelte-v08qz1.svelte-v08qz1{position:relative}.autocomplete-items.svelte-v08qz1.svelte-v08qz1{background:var(--dropdown-bg-color);box-shadow:0 2px 4px var(--drop-shadow-bright);position:absolute;top:4px;left:0;width:200px;max-height:166px;overflow-y:scroll;border-radius:8px;box-sizing:border-box;z-index:var(--z-dropdowns);padding:8px 0}.autocomplete-items.svelte-v08qz1 button.svelte-v08qz1{background:var(--dropdown-bg-color);display:block;color:var(--text-color);border:none;text-align:left;padding:8px 16px;font-size:18px;line-height:18px;width:100%;box-sizing:border-box}.autocomplete-items.svelte-v08qz1 button.svelte-v08qz1:hover,.autocomplete-items.svelte-v08qz1 button.svelte-v08qz1:focus{background:var(--list-item-hover)}.page.hidden.svelte-dkeqh1{display:none}h3.svelte-dkeqh1{margin:16px 0 0;font-size:18px}li.svelte-dkeqh1{padding:3px 2px;font-size:15px}svg.svelte-3buvxh{display:block}h3.svelte-u4lhmn{margin:16px 0 0;font-size:18px}li.svelte-u4lhmn{padding:3px 2px;font-size:15px}.did-you-know.svelte-flkp1t.svelte-flkp1t{margin:12px 0 12px -4px;position:relative}.quote.svelte-flkp1t.svelte-flkp1t{background:var(--did-you-know-bg);border-radius:30px;box-shadow:0 1px 0 var(--drop-shadow);margin:0 0 0 38px;padding:24px 28px;font-size:15px;line-height:140%;text-align:left;position:relative}.talk-pointer.svelte-flkp1t svg.svelte-flkp1t{bottom:3px;color:var(--did-you-know-bg);height:15px;left:-4px;position:absolute;width:23px}.coach.svelte-flkp1t.svelte-flkp1t{bottom:0;font-size:34px;left:0;line-height:34px;position:absolute}.actions.svelte-v4czag{display:grid;grid-gap:10px;grid-auto-flow:column}.actions.has-margin.svelte-v4czag{margin:16px 0}.actions.left.svelte-v4czag{justify-content:start}.actions.right.svelte-v4czag{justify-content:end}.actions.center.svelte-v4czag{justify-content:center}.food-option.svelte-1bwpyed{cursor:pointer;background:var(--card-dull-bg-color);border-radius:4px;box-shadow:0 1px 2px var(--drop-shadow);color:var(--text-color);font-weight:var(--bold-weight);padding:6px;position:relative;display:grid;grid-template-columns:50px 1fr;grid-gap:8px;align-items:stretch;text-align:left;outline:none;width:100%}.food-option.unclickable.svelte-1bwpyed{cursor:default}.food-option.selected.svelte-1bwpyed{background:var(--card-bg-color);box-shadow:0 0 1px 2px var(--input-border-focus)}.food-emoji.svelte-1bwpyed{font-size:28px;border-radius:2px;background:#ccc;display:grid;justify-items:center;align-items:center}.food-name.svelte-1bwpyed{margin:4px 0 0 0;font-size:16px;line-height:140%}.food-macros.svelte-1bwpyed{font-size:15px;line-height:140%;font-weight:var(--bold-weight);margin:4px 0 6px;color:var(--text-color);display:grid;grid-template-columns:1fr 1fr 1fr}.macro-type.svelte-1bwpyed{font-size:13px;font-weight:var(--regular-weight)}.tabs.svelte-q68fuy{border-bottom:1px solid var(--border-color);display:grid;justify-content:start;grid-auto-flow:column;margin:14px 0}button.svelte-q68fuy{background:transparent;border:0;color:var(--text-color-dull);font-weight:var(--regular-weight);padding:8px 16px;margin:0}button.active.svelte-q68fuy{border-bottom:2px solid var(--border-color-bright);color:var(--text-color-bright);font-weight:var(--bold-weight);position:relative;top:1px}.slider.svelte-c6poyb.svelte-c6poyb{position:relative;margin:-10px 56px 0;height:40px;width:auto}.decrease.svelte-c6poyb.svelte-c6poyb,.increase.svelte-c6poyb.svelte-c6poyb{cursor:pointer;position:absolute;height:40px;line-height:40px;width:50px;top:4px;font-size:15px;-webkit-tap-highlight-color:transparent;user-select:none;text-align:center}.decrease.svelte-c6poyb.svelte-c6poyb{left:-50px}.increase.svelte-c6poyb.svelte-c6poyb{right:-50px}.ticks.svelte-c6poyb.svelte-c6poyb{pointer-events:none;position:absolute;left:0;top:34px;display:grid;grid-auto-flow:column;width:100%;height:5px;padding:0 10px;box-sizing:border-box;justify-items:center;justify-content:space-between}.ticks.svelte-c6poyb .tick.svelte-c6poyb{width:1px;height:100%;background:var(--border-color)}.pseudo-slider.svelte-c6poyb.svelte-c6poyb{background:hsla(var(--green-hue), 70%, 40%, 0.4);border-radius:12px;cursor:pointer;height:14px;pointer-events:none;position:absolute;top:16px;width:100%}.pseudo-slider.svelte-c6poyb .track.svelte-c6poyb{position:absolute;left:11px;width:calc(100% - 22px);height:14px}.pseudo-slider.svelte-c6poyb .handle.svelte-c6poyb{background:var(--button-primary-bg-color);box-shadow:1px 1px 0 rgba(255, 255, 255, 0.1) inset;width:20px;height:20px;border-radius:2px;position:absolute;left:0;top:-3px;margin-left:-10px;transition:left 80ms ease-out}.pseudo-slider.svelte-c6poyb .handle.svelte-c6poyb:hover{background:var(--button-primary-bg-color-hover)}.real-slider.svelte-c6poyb.svelte-c6poyb{opacity:0;position:absolute;top:0;left:0;width:100%;cursor:pointer;height:40px}.input.svelte-1yi7mfr{position:relative}input.svelte-1yi7mfr{background:var(--input-bg-color);border:1px solid var(--input-border-color);border-radius:5px;color:var(--text-color);font-size:18px;padding:8px 10px;outline:none;box-sizing:border-box;width:100%;appearance:none;-webkit-appearance:none;-moz-appearance:none}input.faded.svelte-1yi7mfr{color:var(--text-color-dull);font-weight:var(--regular-weight)}input.oversized.svelte-1yi7mfr{font-size:22px;padding:10px 12px}input.small.svelte-1yi7mfr{font-size:16px;padding:6px 8px}input.secret-code.svelte-1yi7mfr{font-size:60px;padding:10px 12px;text-align:center;width:100%}input.svelte-1yi7mfr:hover{border:1px solid var(--input-border-hover)}input.svelte-1yi7mfr:active,input.svelte-1yi7mfr:focus{background:var(--input-bg-color-focus);box-shadow:0 0 1px 1px var(--input-border-focus);border:1px solid var(--input-border-focus);outline:none}input[readonly].svelte-1yi7mfr{background:transparent;border:1px solid transparent}.suffix.svelte-1yi7mfr{color:var(--text-color-dull);pointer-events:none;position:absolute;right:10px;top:10px}.suffix.oversized.svelte-1yi7mfr{right:12px;top:16px}