html {
  /* base hues */
  --red-hue: 5;
  --orange-hue: 26;
  --brown-hue: 30;
  --yellow-hue: 50;
  --green-yellow-hue: 70;
  --green-hue: 95;
  --aqua-hue: 170;
  --blue-hue: 210;
  --blurple-hue: 230;
  --purple-hue: 290;
  --pink-hue: 355;

  /* z-indexes */
  --z-nav-overlay: 9;
  --z-nav: 10;
  --z-fixed-actions: 80;
  --z-line-controls: 85;
  --z-modal-dialog-backdrop: 90;
  --z-modal-dialogs: 100;
  --z-panel: 105;
  --z-dropdowns: 110;
  --z-toasts: 120;
  --z-tooltips: 130;
  --z-lightbox-backdrop: 140;
  --z-lightbox: 150;

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

  /* weights */
  --regular-weight: 400;
  --bold-weight: 650;

  /* typography */
  /* --font-family: Figtree, sans-serif; */
  /* --font-family: "Hanken Grotesk", sans-serif; */
  --font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI Variable Display", "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";

  --bounce-easing: cubic-bezier(0.18, 1.4, 0.4, 1);

  --nav-width: 180px;
  --nav-height: 50px;
}

html.theme-light {
  --html-bg-color: hsl(var(--brown-hue), 0%, 97%);
  --page-bg-color: hsl(var(--brown-hue), 0%, 97%);
  --dialog-bg-color: hsl(var(--brown-hue), 0%, 97%);
  --page-blurred-bg: hsl(var(--brown-hue), 5%, 85%);

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

  --nav-overlay-bg-color: rgba(0, 0, 0, 0.4);
  --nav-link-bg-color-focus: rgba(0, 0, 0, 0.05);

  --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(0, 0, 0, 0.08);
  --input-border-hover: rgba(0, 0, 0, 0.2);
  --input-border-focus: hsl(var(--blue-hue), 100%, 60%);
  --input-border-green-focus: hsl(var(--green-hue), 90%, 35%);

  --radio-button-bg: #fff;

  --text-color-bright: #111;
  --text-color: #333;
  --text-color-dullish: #555;
  --text-color-dull: #707070;
  --text-color-very-dull: #999;

  --strikethrough-color: rgba(0, 0, 0, 0.25);

  --text-selected-bg: hsla(var(--blue-hue), 95%, 50%, 0.3);
  --text-selected-color: hsl(var(--blue-hue), 95%, 10%);

  --default-selection-bg: hsla(var(--yellow-hue), 100%, 50%, 0.4);
  --default-selection-color: hsl(var(--yellow-hue), 100%, 15%);

  --line-selected-bg: hsla(var(--blue-hue), 95%, 50%, 0.15);

  --highlighted-billing-cell: hsla(var(--green-hue), 70%, 65%, 0.25);

  --text-color-danger: hsl(var(--red-hue), 60%, 30%);
  --text-color-alert: hsl(var(--yellow-hue), 60%, 35%);
  --text-color-success: hsl(var(--green-hue), 60%, 30%);

  --pros-bg-color: hsl(var(--green-hue), 60%, 97%);
  --cons-bg-color: hsl(var(--red-hue), 60%, 98%);

  --icon-red: hsl(var(--red-hue), 100%, 40%);
  --icon-yellow: hsl(var(--yellow-hue), 100%, 40%);
  --icon-green: hsl(var(--green-hue), 100%, 36%);

  --diff-before-bg: hsla(var(--red-hue), 80%, 60%, 0.05);
  --diff-before-text: hsl(var(--red-hue), 20%, 35%);
  --diff-after-bg: hsla(var(--green-hue), 80%, 60%, 0.05);
  --diff-after-text: hsl(var(--green-hue), 20%, 35%);

  --tag-bg-color: transparent;

  --link-color: hsl(var(--blue-hue), 70%, 35%);
  --link-underline-color: hsl(var(--blue-hue), 70%, 60%);
  --link-color-hover: hsl(var(--blue-hue), 70%, 25%);

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

  --mention-color: hsl(var(--blue-hue), 70%, 50%);
  --mention-bg-color: hsl(var(--blue-hue), 70%, 94%);

  --placeholder-color: #ccc;

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

  --button-bg-color: #fff;
  --button-bg-color-hover: rgba(0, 0, 0, 0.06);
  --button-disabled-bg-color: rgba(0, 0, 0, 0.85);
  --button-box-shadow: rgba(0, 0, 0, 0.08);
  --button-box-shadow-hover: rgba(0, 0, 0, 0.1);
  --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-box-shadow: transparent;
  --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;

  --button-blue-bg-color: hsl(var(--blue-hue), 80%, 60%);
  --button-blue-bg-color-hover: hsl(var(--blue-hue), 80%, 66%);
  --button-blue-bg-color-active: hsl(var(--blue-hue), 80%, 20%);

  --button-red-bg-color: hsla(var(--red-hue), 60%, 65%, 0.5);
  --button-orange-bg-color: hsla(var(--orange-hue), 60%, 65%, 0.5);
  --button-yellow-bg-color: hsla(var(--yellow-hue), 60%, 65%, 0.5);
  --button-green-bg-color: hsla(var(--green-hue), 60%, 65%, 0.5);
  --button-blurple-bg-color: hsla(var(--blurple-hue), 60%, 65%, 0.5);
  --button-purple-bg-color: hsla(var(--purple-hue), 60%, 75%, 0.5);
  --button-pink-bg-color: hsla(var(--pink-hue), 65%, 80%, 0.5);
  --button-gray-bg-color: hsla(var(--blue-hue), 5%, 65%, 0.5);
  --button-brown-bg-color: hsla(var(--brown-hue), 25%, 50%, 0.5);

  --toggle-active-bg: hsl(var(--blue-hue), 60%, 50%);
  --toggle-inactive-bg: hsl(var(--blue-hue), 5%, 92%);
  --toggle-handle-bg: #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;
  --tooltip-text-color-dull: #aaa;
  --tooltip-role-badge-bg-color: rgba(255, 255, 255, 0.1);

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

  --panel-bg-color: #fafafa;

  --fixed-actions-bg: hsla(var(--yellow-hue), 5%, 99%, 0.95);

  --badge-red-bg-color: hsla(var(--red-hue), 80%, 65%, 0.2);
  --badge-red-text-color: hsl(var(--red-hue), 80%, 30%);
  --badge-orange-bg-color: hsl(var(--orange-hue), 95%, 90%);
  --badge-orange-text-color: hsl(var(--orange-hue), 90%, 30%);
  --badge-yellow-bg-color: hsl(var(--yellow-hue), 80%, 84%);
  --badge-yellow-text-color: hsl(var(--yellow-hue), 90%, 25%);
  --badge-green-bg-color: hsla(var(--green-hue), 80%, 65%, 0.2);
  --badge-green-text-color: hsl(var(--green-hue), 80%, 30%);
  --badge-aqua-bg-color: hsla(var(--aqua-hue), 80%, 65%, 0.1);
  --badge-aqua-text-color: hsl(var(--aqua-hue), 90%, 35%);
  --badge-blue-bg-color: hsla(var(--blue-hue), 80%, 65%, 0.1);
  --badge-blue-text-color: hsl(var(--blue-hue), 90%, 35%);
  --badge-gray-bg-color: hsla(var(--blue-hue), 10%, 60%, 0.1);
  --badge-gray-text-color: hsl(var(--blue-hue), 5%, 35%);
  --badge-brown-bg-color: hsla(var(--brown-hue), 20%, 60%, 0.1);
  --badge-brown-text-color: hsl(var(--brown-hue), 25%, 30%);

  --avatar-empty-bg-color: hsla(var(--blue-hue), 10%, 60%, 0.15);

  --card-bg-color: rgba(255, 255, 255, 0.6);
  --card-bg-color-bright: rgba(255, 255, 255, 0.8);

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

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

  /* --homepage-bg: hsl(var(--yellow-hue), 10%, 95%); */
  --homepage-bg: transparent;
  --homepage-footer-bg: rgba(0, 0, 0, 0.85);
  --homepage-footer-text: rgba(255, 255, 255, 0.7);
  --homepage-footer-text-hover: rgba(255, 255, 255, 0.9);

  --message-info-border-color: hsl(var(--blue-hue), 75%, 50%);
  --message-alert-border-color: hsl(var(--yellow-hue), 80%, 60%);
  --message-success-border-color: hsl(var(--green-hue), 60%, 40%);

  /* Used by Avatar and Logo components */
  --swatch-text-color: rgba(255, 255, 255, 0.85);
  --swatch-red: hsl(var(--red-hue), 80%, 60%);
  --swatch-orange: hsl(var(--orange-hue), 88%, 56%);
  --swatch-yellow: hsl(var(--yellow-hue), 100%, 44%);
  --swatch-green: hsl(var(--green-hue), 65%, 45%);
  --swatch-aqua: hsl(var(--aqua-hue), 70%, 50%);
  --swatch-blue: hsl(var(--blue-hue), 70%, 60%);
  --swatch-blurple: hsl(var(--blurple-hue), 70%, 60%);
  --swatch-purple: hsl(var(--purple-hue), 60%, 60%);
  --swatch-pink: hsl(var(--pink-hue), 60%, 72%);
  --swatch-gray: hsl(var(--blue-hue), 5%, 60%);
  --swatch-brown: hsl(var(--brown-hue), 40%, 48%);
  --swatch-white: hsl(var(--blue-hue), 2%, 25%);
  --swatch-rainbow: linear-gradient(45deg, hsl(var(--red-hue), 100%, 50%), hsl(var(--orange-hue), 95%, 60%), hsl(var(--yellow-hue), 100%, 60%), hsl(var(--blue-hue), 90%, 60%), hsl(var(--purple-hue), 90%, 55%));

  /* Used by lines */
  --line-text-color-red: hsl(var(--red-hue), 60%, 40%);
  --line-text-color-orange: hsl(var(--orange-hue), 60%, 40%);
  --line-text-color-yellow: hsl(var(--yellow-hue), 60%, 40%);
  --line-text-color-green: hsl(var(--green-hue), 60%, 40%);
  --line-text-color-aqua: hsl(var(--aqua-hue), 60%, 40%);
  --line-text-color-blue: hsl(var(--blue-hue), 60%, 40%);
  --line-text-color-blurple: hsl(var(--blurple-hue), 60%, 40%);
  --line-text-color-purple: hsl(var(--purple-hue), 60%, 40%);
  --line-text-color-pink: hsl(var(--pink-hue), 60%, 40%);
  --line-text-color-gray: hsl(var(--blue-hue), 5%, 40%);
  --line-text-color-brown: hsl(var(--brown-hue), 40%, 40%);

  --line-icon-color-red: hsl(var(--red-hue), 80%, 60%);
  --line-icon-color-orange: hsl(var(--orange-hue), 88%, 56%);
  --line-icon-color-yellow: hsl(var(--yellow-hue), 90%, 45%);
  --line-icon-color-green: hsl(var(--green-hue), 65%, 45%);
  --line-icon-color-aqua: hsl(var(--aqua-hue), 70%, 50%);
  --line-icon-color-blue: hsl(var(--blue-hue), 70%, 60%);
  --line-icon-color-blurple: hsl(var(--blurple-hue), 70%, 60%);
  --line-icon-color-purple: hsl(var(--purple-hue), 60%, 60%);
  --line-icon-color-pink: hsl(var(--pink-hue), 60%, 72%);
  --line-icon-color-gray: hsl(var(--blue-hue), 5%, 60%);
  --line-icon-color-brown: hsl(var(--brown-hue), 40%, 50%);

  --line-controls-bg: hsl(var(--blue-hue), 5%, 98%);
}

html.theme-dark {
  --html-bg-color: #000;
  --page-bg-color: hsl(var(--brown-hue), 5%, 8%);
  --dialog-bg-color: hsl(var(--brown-hue), 5%, 8%);
  --page-blurred-bg: hsl(var(--brown-hue), 5%, 8%);

  --nav-overlay-bg-color: rgba(0, 0, 0, 0.7);

  --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%);
  --input-border-green-focus: hsl(var(--green-hue), 90%, 35%);

  --radio-button-bg: #000;

  --tag-bg-color: transparent;

  --text-color-bright: #fafafa;
  --text-color: rgba(255, 255, 255, 0.9);
  --text-color-dullish: rgba(255, 255, 255, 0.7);
  --text-color-dull: rgba(255, 255, 255, 0.55);
  --text-color-very-dull: rgba(255, 255, 255, 0.4);

  --strikethrough-color: rgba(255, 255, 255, 0.25);

  --text-selected-bg: hsla(var(--blue-hue), 95%, 50%, 0.3);
  --text-selected-color: hsl(var(--blue-hue), 95%, 90%);

  --default-selection-bg: hsla(var(--orange-hue), 95%, 50%, 0.3);
  --default-selection-color: hsl(var(--orange-hue), 95%, 90%);

  --line-selected-bg: hsla(var(--blue-hue), 95%, 40%, 0.15);

  --highlighted-billing-cell: hsla(var(--green-hue), 50%, 30%, 0.2);

  --pros-bg-color: hsl(var(--green-hue), 25%, 17%);
  --cons-bg-color: hsl(var(--red-hue), 25%, 19%);

  --text-color-danger: hsl(var(--red-hue), 50%, 70%);
  --text-color-alert: hsl(var(--yellow-hue), 60%, 70%);
  --text-color-success: hsl(var(--green-hue), 40%, 60%);

  --icon-red: hsl(var(--red-hue), 100%, 45%);
  --icon-yellow: hsl(var(--yellow-hue), 100%, 45%);
  --icon-green: hsl(var(--green-hue), 90%, 40%);

  --diff-before-bg: hsla(var(--red-hue), 80%, 60%, 0.1);
  --diff-before-text: hsl(var(--red-hue), 20%, 70%);
  --diff-after-bg: hsla(var(--green-hue), 80%, 60%, 0.08);
  --diff-after-text: hsl(var(--green-hue), 20%, 70%);

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

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

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

  --mention-color: hsl(var(--blue-hue), 75%, 75%);
  --mention-bg-color: hsla(var(--blue-hue), 75%, 20%, 0.5);

  --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-box-shadow: rgba(255, 255, 255, 0.08);
  --button-box-shadow-hover: rgba(255, 255, 255, 0.08);
  --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-disabled-bg-color: rgba(255, 255, 255, 0.6);

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

  --button-primary-bg-color: hsl(var(--green-hue), 60%, 32%);
  --button-primary-box-shadow: rgba(255, 255, 255, 0.15);
  --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;

  --button-red-bg-color: hsla(var(--red-hue), 80%, 32%, 0.5);
  --button-orange-bg-color: hsla(var(--orange-hue), 80%, 32%, 0.5);
  --button-yellow-bg-color: hsla(var(--yellow-hue), 80%, 32%, 0.5);
  --button-green-bg-color: hsla(var(--green-hue), 80%, 32%, 0.5);
  --button-blue-bg-color: hsla(var(--blue-hue), 80%, 32%, 0.5);
  --button-blurple-bg-color: hsla(var(--blurple-hue), 80%, 50%, 0.5);
  --button-purple-bg-color: hsla(var(--purple-hue), 80%, 32%, 0.5);
  --button-pink-bg-color: hsla(var(--pink-hue), 80%, 32%, 0.5);
  --button-brown-bg-color: hsla(var(--brown-hue), 30%, 40%, 0.5);

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

  --panel-bg-color: #393939;

  --fixed-actions-bg: hsla(var(--yellow-hue), 5%, 2%, 0.95);

  --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;

  --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: #333;
  --tooltip-text-color: #eee;
  --tooltip-text-color-dull: #999;
  --tooltip-role-badge-bg-color: rgba(255, 255, 255, 0.1);

  --badge-red-bg-color: hsla(var(--red-hue), 70%, 25%, 0.5);
  --badge-red-text-color: hsl(var(--red-hue), 50%, 80%);
  --badge-orange-bg-color: hsla(var(--orange-hue), 70%, 25%, 0.5);
  --badge-orange-text-color: hsl(var(--orange-hue), 50%, 75%);
  --badge-yellow-bg-color: hsla(var(--yellow-hue), 70%, 25%, 0.6);
  --badge-yellow-text-color: hsl(var(--yellow-hue), 50%, 75%);
  --badge-green-bg-color: hsla(var(--green-hue), 70%, 25%, 0.5);
  --badge-green-text-color: hsl(var(--green-hue), 50%, 80%);
  --badge-aqua-bg-color: hsla(var(--aqua-hue), 70%, 25%, 0.5);
  --badge-aqua-text-color: hsl(var(--aqua-hue), 50%, 80%);
  --badge-blue-bg-color: hsla(var(--blue-hue), 70%, 30%, 0.4);
  --badge-blue-text-color: hsl(var(--blue-hue), 60%, 90%);
  --badge-gray-bg-color: hsla(var(--blue-hue), 5%, 70%, 0.5);
  --badge-gray-text-color: hsl(var(--blue-hue), 5%, 90%);
  --badge-brown-bg-color: hsl(var(--brown-hue), 20%, 50%);
  --badge-brown-text-color: hsl(var(--brown-hue), 20%, 90%);

  --avatar-empty-bg-color: hsla(var(--blue-hue), 5%, 70%, 0.15);

  --card-bg-color: rgba(255, 255, 255, 0.04);
  --card-bg-color-bright: rgba(255, 255, 255, 0.08);

  --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.15);

  --homepage-footer-bg: rgba(0, 0, 0, 0.3);
  --homepage-bg: transparent;
  --homepage-footer-text: var(--text-color);
  --homepage-footer-text-hover: var(--text-color-bright);

  --message-info-border-color: hsl(var(--blue-hue), 75%, 40%);
  --message-alert-border-color: hsl(var(--yellow-hue), 80%, 50%);
  --message-success-border-color: hsl(var(--green-hue), 60%, 45%);

  /* Used by Avatar and Logo components */
  --swatch-text-color: rgba(255, 255, 255, 0.85);
  --swatch-red: hsl(var(--red-hue), 75%, 42%);
  --swatch-orange: hsl(var(--orange-hue), 85%, 42%);
  --swatch-yellow: hsl(var(--yellow-hue), 90%, 44%);
  --swatch-green: hsl(var(--green-hue), 85%, 35%);
  --swatch-aqua: hsl(var(--aqua-hue), 85%, 40%);
  --swatch-blue: hsl(var(--blue-hue), 90%, 45%);
  --swatch-blurple: hsl(var(--blurple-hue), 85%, 55%);
  --swatch-purple: hsl(var(--purple-hue), 75%, 42%);
  --swatch-pink: hsl(var(--pink-hue), 45%, 60%);
  --swatch-gray: hsl(var(--blue-hue), 3%, 44%);
  --swatch-brown: hsl(var(--brown-hue), 35%, 45%);
  --swatch-white: hsl(var(--blue-hue), 2%, 90%);
  --swatch-rainbow: linear-gradient(45deg, hsl(var(--red-hue), 100%, 50%), hsl(var(--orange-hue), 95%, 60%), hsl(var(--yellow-hue), 100%, 60%), hsl(var(--blue-hue), 90%, 60%), hsl(var(--purple-hue), 90%, 55%));

  /* Used by lines */
  --line-text-color-red: hsl(var(--red-hue), 60%, 40%);
  --line-text-color-orange: hsl(var(--orange-hue), 60%, 40%);
  --line-text-color-yellow: hsl(var(--yellow-hue), 60%, 40%);
  --line-text-color-green: hsl(var(--green-hue), 60%, 40%);
  --line-text-color-aqua: hsl(var(--aqua-hue), 60%, 40%);
  --line-text-color-blue: hsl(var(--blue-hue), 60%, 40%);
  --line-text-color-blurple: hsl(var(--blurple-hue), 60%, 40%);
  --line-text-color-purple: hsl(var(--purple-hue), 60%, 40%);
  --line-text-color-pink: hsl(var(--pink-hue), 60%, 40%);
  --line-text-color-gray: hsl(var(--blue-hue), 5%, 40%);
  --line-text-color-brown: hsl(var(--brown-hue), 40%, 40%);

  --line-icon-color-red: hsl(var(--red-hue), 60%, 40%);
  --line-icon-color-orange: hsl(var(--orange-hue), 60%, 40%);
  --line-icon-color-yellow: hsl(var(--yellow-hue), 60%, 40%);
  --line-icon-color-green: hsl(var(--green-hue), 60%, 40%);
  --line-icon-color-aqua: hsl(var(--aqua-hue), 60%, 40%);
  --line-icon-color-blue: hsl(var(--blue-hue), 60%, 40%);
  --line-icon-color-blurple: hsl(var(--blurple-hue), 60%, 40%);
  --line-icon-color-purple: hsl(var(--purple-hue), 60%, 40%);
  --line-icon-color-pink: hsl(var(--pink-hue), 60%, 40%);
  --line-icon-color-gray: hsl(var(--blue-hue), 5%, 40%);
  --line-icon-color-brown: hsl(var(--brown-hue), 40%, 40%);

  --line-controls-bg: hsl(var(--blue-hue), 5%, 20%);
}

html, body {
  margin: 0;
  padding: 0;
  background: var(--html-bg-color);
  text-rendering: optimizeLegibility;
  font-optical-sizing: auto;
  /* Prevent font scaling in landscape while allowing user zoom */
  /* Ref: https://stackoverflow.com/a/2711132/440094 */
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  /* This is for Figtree. */
  /* font-variation-settings:
    "wdth" 87.5,
    "YTLC" 500; */
}

html, body {
  /* Prevent double-tap zoom and pinch-to-zoom */
  touch-action: none;
}

::selection {
  background: var(--default-selection-bg);
  color: var(--default-selection-color);
}

::-moz-selection {
  background: var(--default-selection-bg);
  color: var(--default-selection-color);
}

/*
.editor ::selection {
  background: transparent;
  color: var(--text-selected-color);
}

.editor ::-moz-selection {
  background: transparent;
  color: var(--text-selected-color);
}
*/

/* Update scrollbar styles */

/* width */
::-webkit-scrollbar {
  width: 8px;
}

/* Track */
::-webkit-scrollbar-track {
  background: var(--page-bg-color);
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: var(--border-color-dull);
  border-radius: 8px;
}

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

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

@media (max-width: 800px) {
  body, html {
    /* disallow scrolling on body/html element */
    overflow: hidden;
    height: 100dvh;
  }
}

html, body, select, input, textarea, button {
  font-family: var(--font-family);
  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;
  font-weight: var(--bold-weight);
}

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;
}

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

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

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

.markdown pre {
  background: #222;
  border-radius: 10px;
  color: #eee;
  font-size: 14px;
  line-height: 145%;
  margin: 12px 0 18px;
  padding: 26px 30px;
}

.markdown p > code {
  background: var(--card-bg-color);
  box-shadow: 0 0px 1px 1px var(--border-color);
  border-radius: 6px;
  margin: 0 2px;
  padding: 3px 7px;
}

input {
  margin: 0;
}

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

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

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

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

th {
  font-weight: var(--bold-weight);
  padding: 9px 12px 9px 12px;
  text-align: left;
}

td {
  border-top: 1px solid var(--border-color-dull);
  padding: 9px 12px 9px 12px;
}

.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;
  box-shadow: 0 0 2px 3px var(--input-border-focus);
}

.relative {
  position: relative;
}

.dull {
  color: var(--text-color-very-dull);
  font-weight: var(--regular-weight);
}

.scale-in {
  transform: scale(0.96);
  transition: transform 2000ms cubic-bezier(0, 0, 0.24, 1);
}

.fade-and-scale-in {
  transform: scale(0.5);
  opacity: 0;
  transition: transform 500ms var(--bounce-easing), opacity 400ms cubic-bezier(0, 0, 0.5, 1);
}

.scaled-in {
  transform: scale(1);
}

.fade-in-all > *,
.fade-in-solo {
  opacity: 0;
  transition: opacity 400ms cubic-bezier(0, 0, 0.5, 1);
}

.fade-in-fast {
  opacity: 0;
  transition: opacity 200ms cubic-bezier(0, 0, 0.5, 1);
}

.faded-in {
  opacity: 1;
}

.line.line-h2.text-color-red,
.bullet.text-color-red {
  color: var(--line-text-color-red) !important;
}

.line.line-h2.text-color-orange,
.bullet.text-color-orange {
  color: var(--line-text-color-orange) !important;
}

.line.line-h2.text-color-yellow,
.bullet.text-color-yellow {
  color: var(--line-text-color-yellow) !important;
}

.line.line-h2.text-color-green,
.bullet.text-color-green {
  color: var(--line-text-color-green) !important;
}

.line.line-h2.text-color-aqua,
.bullet.text-color-aqua {
  color: var(--line-text-color-aqua) !important;
}

.line.line-h2.text-color-blue,
.bullet.text-color-blue {
  color: var(--line-text-color-blue) !important;
}

.line.line-h2.text-color-blurple,
.bullet.text-color-blurple {
  color: var(--line-text-color-blurple) !important;
}

.line.line-h2.text-color-purple,
.bullet.text-color-purple {
  color: var(--line-text-color-purple) !important;
}

.line.line-h2.text-color-pink,
.bullet.text-color-pink {
  color: var(--line-text-color-pink) !important;
}

.line.line-h2.text-color-gray,
.bullet.text-color-gray {
  color: var(--line-text-color-gray) !important;
}

.line.line-h2.text-color-brown,
.bullet.text-color-brown {
  color: var(--line-text-color-brown) !important;
}

.checkbox.icon-color-red svg.icon-circle {
  stroke: var(--line-icon-color-red);
}

.checkbox.icon-color-orange svg.icon-circle {
  stroke: var(--line-icon-color-orange);
}

.checkbox.icon-color-yellow svg.icon-circle {
  stroke: var(--line-icon-color-yellow);
}

.checkbox.icon-color-green svg.icon-circle {
  stroke: var(--line-icon-color-green);
}

.checkbox.icon-color-aqua svg.icon-circle {
  stroke: var(--line-icon-color-aqua);
}

.checkbox.icon-color-blue svg.icon-circle {
  stroke: var(--line-icon-color-blue);
}

.checkbox.icon-color-blurple svg.icon-circle {
  stroke: var(--line-icon-color-blurple);
}

.checkbox.icon-color-purple svg.icon-circle {
  stroke: var(--line-icon-color-purple);
}

.checkbox.icon-color-pink svg.icon-circle {
  stroke: var(--line-icon-color-pink);
}

.checkbox.icon-color-gray svg.icon-circle {
  stroke: var(--line-icon-color-gray);
}

.checkbox.icon-color-brown svg.icon-circle {
  stroke: var(--line-icon-color-brown);
}

.checkbox.icon-color-red svg.icon-check-circle circle {
  fill: var(--line-icon-color-red);
}

.checkbox.icon-color-orange svg.icon-check-circle circle {
  fill: var(--line-icon-color-orange);
}

.checkbox.icon-color-yellow svg.icon-check-circle circle {
  fill: var(--line-icon-color-yellow);
}

.checkbox.icon-color-green svg.icon-check-circle circle {
  fill: var(--line-icon-color-green);
}

.checkbox.icon-color-aqua svg.icon-check-circle circle {
  fill: var(--line-icon-color-aqua);
}

.checkbox.icon-color-blue svg.icon-check-circle circle {
  fill: var(--line-icon-color-blue);
}

.checkbox.icon-color-blurple svg.icon-check-circle circle {
  fill: var(--line-icon-color-blurple);
}

.checkbox.icon-color-purple svg.icon-check-circle circle {
  fill: var(--line-icon-color-purple);
}

.checkbox.icon-color-pink svg.icon-check-circle circle {
  fill: var(--line-icon-color-pink);
}

.checkbox.icon-color-gray svg.icon-check-circle circle {
  fill: var(--line-icon-color-gray);
}

.checkbox.icon-color-brown svg.icon-check-circle circle {
  fill: var(--line-icon-color-brown);
}

/* Circle Check */

svg.icon-check-circle polyline {
  stroke: var(--page-bg-color);
}

svg.svelte-3buvxh{display:block}
.actions.svelte-1flim4x{display:grid;grid-gap:10px;grid-auto-flow:column}.actions.has-margin.svelte-1flim4x{margin:16px 0}.actions.left.svelte-1flim4x{justify-content:start}.actions.right.svelte-1flim4x{justify-content:end}.actions.center.svelte-1flim4x{justify-content:center}.actions.has-border.svelte-1flim4x{border-top:1px solid var(--border-color-dull);padding-top:12px;margin-top:2px}
.card.svelte-18mxlsc{background:var(--card-bg-color);border-radius:8px;box-shadow:0 1px 3px 0 var(--drop-shadow), 0 1px 0 0 var(--drop-shadow-dull);box-sizing:border-box;margin:12px 0;padding:8px 18px}.card.no-padding.svelte-18mxlsc{padding:0}.card.no-margin.svelte-18mxlsc{margin:0}.card.extra-padding.svelte-18mxlsc{padding:16px 18px}.card.svelte-18mxlsc + h2{margin-top:28px}
.empty-avatar.svelte-10vmgld{align-items:center;background:var(--avatar-empty-bg-color);border-radius:50%;color:var(--avatar-empty-text-color);display:flex;font-size:12px;font-weight:var(--bold-weight);justify-content:center}
.avatar-tooltip.svelte-1ncbak0.svelte-1ncbak0{display:grid;grid-gap:20px;padding:6px 4px;grid-template-columns:80px 180px;align-items:center}.info.svelte-1ncbak0.svelte-1ncbak0{text-align:left;display:grid;align-content:space-between;height:calc(100% - 6px)}.info.svelte-1ncbak0 h3.svelte-1ncbak0{color:var(--tooltip-text-color);font-size:17px;line-height:17px;font-weight:var(--bold-weight);margin:0 0 5px}
.avatar.svelte-14o1sri{display:grid;grid-auto-flow:column;grid-gap:10px;justify-content:start;align-items:start}.avatar.center.svelte-14o1sri{align-items:center}.name.svelte-14o1sri{font-weight:var(--bold-weight)}
.button.svelte-3wclry.svelte-3wclry{background:var(--button-bg-color);border-radius:7px;border:0;box-shadow:0 -1px 0 0 var(--button-box-shadow) inset;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-3wclry svg{stroke:var(--text-color)}.button.delete.svelte-3wclry.svelte-3wclry{background:none;opacity:0.5}.button.small.svelte-3wclry.svelte-3wclry{padding:5px 12px 6px;font-size:14px}.button.tiny.svelte-3wclry.svelte-3wclry{padding:4px 12px 5px;font-size:13px}.button.oversized.svelte-3wclry.svelte-3wclry{padding:16px 30px;font-size:20px}.button.input-like.svelte-3wclry.svelte-3wclry{background:var(--button-input-like-bg-color);padding:5px 0 6px;font-size:12px;width:32px}.button.border-only.svelte-3wclry.svelte-3wclry{background:none;border:1px solid var(--border-color-dull);padding-top:9px;padding-bottom:9px}.button.alert.svelte-3wclry.svelte-3wclry{background:var(--button-alert-bg-color);color:var(--button-alert-text-color)}.button.no-background.svelte-3wclry.svelte-3wclry{background:none;box-shadow:none}.button.close.svelte-3wclry.svelte-3wclry{background:none;box-shadow:none !important;padding:10px 10px}.button.disabled.svelte-3wclry.svelte-3wclry{opacity:0.25;cursor:inherit;pointer-events:none}.button.wide.svelte-3wclry.svelte-3wclry{padding-left:30px;padding-right:30px}button.first.svelte-3wclry.svelte-3wclry{border-radius:7px 0 0 7px}button.second.svelte-3wclry.svelte-3wclry{border-radius:0 7px 7px 0;padding:10px 12px}.is-saving.svelte-3wclry.svelte-3wclry{opacity:0.8;cursor:inherit;position:relative;pointer-events:none}.spinner.svelte-3wclry.svelte-3wclry{height:100%;left:0;position:absolute;top:0;width:100%;text-align:center;display:grid;align-content:center;justify-content:center}.button.svelte-3wclry .spinner.svelte-3wclry svg{stroke:none}.hide.svelte-3wclry.svelte-3wclry{opacity:0}.button.svelte-3wclry.svelte-3wclry:hover,.button.svelte-3wclry.svelte-3wclry:focus{background:var(--button-bg-color-hover);box-shadow:0 -1px 0 0 var(--button-box-shadow-hover) inset}.button.svelte-3wclry.svelte-3wclry:active{background:var(--button-bg-color-active);box-shadow:none;color:var(--button-text-color-active);text-decoration:none;transform:scale(0.97)}.button.scale-on-hover.svelte-3wclry.svelte-3wclry:hover,.button.scale-on-hover.svelte-3wclry.svelte-3wclry:focus{transform:scale(1.03)}.button.scale-on-hover.svelte-3wclry.svelte-3wclry:active{transform:scale(0.97)}.button.primary.svelte-3wclry.svelte-3wclry{background:var(--button-primary-bg-color);box-shadow:0 1px 0 var(--button-primary-box-shadow) inset;color:var(--button-primary-text-color)}.button.primary.svelte-3wclry.svelte-3wclry:hover,.button.primary.svelte-3wclry.svelte-3wclry:focus{background:var(--button-primary-bg-color-hover)}.button.primary.svelte-3wclry.svelte-3wclry:active{background:var(--button-primary-bg-color-active);color:var(--button-primary-text-color-active)}.button.alert.svelte-3wclry.svelte-3wclry:hover,.button.alert.svelte-3wclry.svelte-3wclry:focus{background:var(--button-alert-bg-color-hover)}.button.alert.svelte-3wclry.svelte-3wclry:active{background:var(--button-alert-bg-color-active);color:var(--button-alert-text-color-active)}.button.svelte-3wclry .icon-square{margin-right:2px;opacity:0.5}.button.svelte-3wclry .icon-check-square{margin-right:2px;stroke:var(--link-color)}.button.svelte-3wclry .icon-chevron-down{opacity:0.5}.button.color-red.svelte-3wclry.svelte-3wclry{background:var(--button-red-bg-color)}.button.color-orange.svelte-3wclry.svelte-3wclry{background:var(--button-orange-bg-color)}.button.color-yellow.svelte-3wclry.svelte-3wclry{background:var(--button-yellow-bg-color)}.button.color-green.svelte-3wclry.svelte-3wclry{background:var(--button-green-bg-color)}.button.color-blue.svelte-3wclry.svelte-3wclry{background:var(--button-blue-bg-color);color:var(--button-primary-text-color)}.button.color-blue.svelte-3wclry.svelte-3wclry:hover,.button.color-blue.svelte-3wclry.svelte-3wclry:focus{background:var(--button-blue-bg-color-hover)}.button.color-blue.svelte-3wclry.svelte-3wclry:active{background:var(--button-blue-bg-color-active)}.button.color-blurple.svelte-3wclry.svelte-3wclry{background:var(--button-blurple-bg-color)}.button.color-purple.svelte-3wclry.svelte-3wclry{background:var(--button-purple-bg-color)}.button.color-pink.svelte-3wclry.svelte-3wclry{background:var(--button-pink-bg-color)}.button.primary.svelte-3wclry .icon-chevron-down{stroke:var(--button-primary-text-color);fill:var(--button-primary-text-color);opacity:1;stroke-width:0}
form.svelte-fqc82{display:grid;justify-content:stretch;gap:14px 0}
.ghost-button.svelte-4q4b9b{background:none;border:2px dashed var(--border-color);border-radius:4px;color:var(--text-color-dull);cursor:default;opacity:0.6;padding:8px 14px;font-size:15px;font-weight:var(--bold-weight);line-height:20px;text-decoration:none;width:fit-content}
.avatar-card.svelte-wmx4pg{max-width:300px}.avatar-card.svelte-wmx4pg + h2{margin-top:28px}.avatar-display.svelte-wmx4pg{display:grid;grid-gap:12px}.upload-label.svelte-wmx4pg{border:1px dashed var(--border-color-dull);border-radius:6px;cursor:pointer;padding:80px 60px;display:block;text-align:center;font-size:14px;margin:2px 0 8px}.upload-label.svelte-wmx4pg:hover,.upload-label.svelte-wmx4pg:focus{border:1px solid var(--border-color)}.upload-label.user-is-dragging.svelte-wmx4pg:hover{border:1px solid var(--input-border-focus);box-shadow:0 0 1px 1px var(--input-border-focus)}.hidden.svelte-wmx4pg{display:none}
.dropdown-button.svelte-17i3p0a{background:none;border:none;color:var(--text-color);font-weight:var(--bold-weight);cursor:pointer;display:inline-grid;padding:0;margin:0;grid-gap:4px;grid-auto-flow:column;align-items:center;justify-content:space-between;outline:none;transition:transform 100ms ease, background-color 180ms ease}.dropdown-button.line-control.svelte-17i3p0a{border-radius:6px;border:1px solid var(--border-color-dull);font-size:14px;padding:5px 10px 5px 12px}.dropdown-button.with-border.svelte-17i3p0a{border-radius:6px;border:1px solid var(--border-color-dull);padding:7px 12px 7px 16px}.dropdown-button.with-border.svelte-17i3p0a:focus,.dropdown-button.with-border.svelte-17i3p0a:hover{border:1px solid var(--border-color)}.dropdown-button.svelte-17i3p0a svg{opacity:0.4;pointer-events:none;stroke:var(--text-color)}.dropdown-button.svelte-17i3p0a:focus svg,.dropdown-button.svelte-17i3p0a:hover svg{opacity:1}.dropdown-button.with-border.svelte-17i3p0a:active{background:var(--button-bg-color-active);box-shadow:none;color:var(--button-text-color-active);text-decoration:none;transform:scale(0.97)}
h1.svelte-142tc4d{line-height:120%;font-size:28px;margin:2px 0 14px}
.group.svelte-fxdnj7.svelte-fxdnj7{margin:0 0 24px}h3.svelte-fxdnj7.svelte-fxdnj7{margin:18px 0 10px}.group.svelte-fxdnj7 ul.svelte-fxdnj7{margin:10px 0}li.svelte-fxdnj7.svelte-fxdnj7{padding:4px 2px}li.svelte-fxdnj7 a.svelte-fxdnj7{font-weight:var(--regular-weight)}a.selected.svelte-fxdnj7.svelte-fxdnj7{font-weight:var(--bold-weight);color:var(--link-color-hover)}@media(max-width: 900px){.nav.svelte-fxdnj7.svelte-fxdnj7{border-bottom:1px solid var(--border-color)}}
.settings-page.svelte-1be3i1d{display:grid;grid-template-columns:200px 1fr;grid-gap:24px;border-top:1px solid var(--border-color-dull);padding-top:8px}@media(max-width: 900px){.settings-page.svelte-1be3i1d{display:block}}
.swatch.svelte-107ud3e{align-content:center;box-shadow:0 1px 1px var(--drop-shadow), 0 1px 1px var(--button-box-shadow) inset;border-radius:100px;color:var(--swatch-text-color);display:inline-grid;font-weight:var(--bold-weight);justify-items:center;margin:0}
.input.svelte-fvtwci.svelte-fvtwci{position:relative}input.svelte-fvtwci.svelte-fvtwci{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}.has-prefix.svelte-fvtwci input.svelte-fvtwci{padding-left:28px}input.faded.svelte-fvtwci.svelte-fvtwci{color:var(--text-color-dull);font-weight:var(--regular-weight)}input.bold.svelte-fvtwci.svelte-fvtwci{font-weight:var(--bold-weight)}input.oversized.svelte-fvtwci.svelte-fvtwci{font-size:22px;padding:10px 12px}input.header.svelte-fvtwci.svelte-fvtwci{font-size:24px;padding:10px 12px;font-weight:var(--bold-weight)}input.small.svelte-fvtwci.svelte-fvtwci{font-size:16px;padding:6px 8px}input.button-height.svelte-fvtwci.svelte-fvtwci{font-size:16px;padding:8px 12px 7px}input.secret-code.svelte-fvtwci.svelte-fvtwci{font-size:60px;padding:10px 12px;text-align:center;width:100%}input.svelte-fvtwci.svelte-fvtwci:hover{border:1px solid var(--input-border-hover)}input.svelte-fvtwci.svelte-fvtwci:active,input.svelte-fvtwci.svelte-fvtwci: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-fvtwci.svelte-fvtwci{background:transparent;border:1px solid transparent}.suffix.svelte-fvtwci.svelte-fvtwci{color:var(--text-color-dull);pointer-events:none;position:absolute;right:10px;top:10px}.prefix.svelte-fvtwci.svelte-fvtwci{color:var(--text-color-very-dull);pointer-events:none;position:absolute;left:10px;top:10px}.suffix.oversized.svelte-fvtwci.svelte-fvtwci{right:12px;top:16px}
.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}
.textfield.svelte-pbpgak.svelte-pbpgak{text-align:left}.textfield.has-label.svelte-pbpgak.svelte-pbpgak{display:grid;justify-items:stretch;grid-template-columns:70px auto;align-items:center}.input-button-parent.svelte-pbpgak.svelte-pbpgak{display:block}.input-button-parent.has-buttons.svelte-pbpgak.svelte-pbpgak{display:grid;grid-template-columns:32px 32px 1fr;grid-gap:1px}.pseudo-input.svelte-pbpgak.svelte-pbpgak{background:var(--page-bg-color);border:none;border-radius:5px;color:var(--text-color-dull);font-size:18px;padding:8px 10px}label.svelte-pbpgak.svelte-pbpgak{color:var(--text-color-dull);font-size:14px;line-height:150%}.dropdown-as-input.svelte-pbpgak button{background:var(--input-bg-color);border-radius:5px;border:1px solid var(--input-border-color);box-sizing:border-box;color:var(--text-color);font-size:16px;outline:none;padding:8px 10px 8px 14px}.slider-parent.svelte-pbpgak.svelte-pbpgak{top:-8px;position:relative}.slider-parent.has-label.svelte-pbpgak.svelte-pbpgak{padding-left:70px}.autocomplete-parent.svelte-pbpgak.svelte-pbpgak{position:relative}.autocomplete-items.svelte-pbpgak.svelte-pbpgak{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-pbpgak button.svelte-pbpgak{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-pbpgak button.svelte-pbpgak:hover,.autocomplete-items.svelte-pbpgak button.svelte-pbpgak:focus{background:var(--list-item-hover)}
.form-group.svelte-2v19si{margin:0 0 12px;display:grid;grid-gap:14px}.form-group.svelte-2v19si .actions{margin:12px 0 16px}.form-note.svelte-2v19si{margin:2px 0 2px 102px;font-size:14px;color:var(--text-color-dull)}.swatch-parent.svelte-2v19si{border-radius:4px;background:var(--input-bg-color);padding:6px 8px;display:grid;align-items:center;justify-items:center}
h3.svelte-15oq2t0{margin:2px 0 10px;text-align:left}p.svelte-15oq2t0{margin:2px 0}.integration.svelte-15oq2t0{position:relative;padding-left:50px}.emoji.svelte-15oq2t0{font-size:32px;line-height:100%;width:36px;text-align:center;position:absolute;left:0;top:2px}.plan-button.svelte-15oq2t0{margin:6px 0 4px;display:grid;justify-items:center}.plan-details.svelte-15oq2t0 svg.icon-check{left:2px;stroke:var(--button-primary-text-color);stroke-width:4px;position:relative;top:-1px}.plan-details.svelte-15oq2t0{display:grid;grid-auto-flow:row;margin:18px 0 8px;grid-gap:14px}th.svelte-15oq2t0,td.svelte-15oq2t0{width:26%;text-align:center}th.svelte-15oq2t0{padding-top:10px}th.label.svelte-15oq2t0,td.label.svelte-15oq2t0{width:100px;text-align:left;vertical-align:top}th.highlighted.svelte-15oq2t0,td.highlighted.svelte-15oq2t0{background:var(--highlighted-billing-cell);font-weight:var(--bold-weight)}th.highlighted.svelte-15oq2t0{border-radius:8px 8px 0 0}td.highlighted.last.svelte-15oq2t0{border-radius:0 0 8px 8px}.highlighted.svelte-15oq2t0 button{pointer-events:none}@media(max-width: 800px){.integration.svelte-15oq2t0{padding-left:0}.emoji.svelte-15oq2t0{margin:0 0 10px;position:static}}
.close.svelte-1mye7r2{background:none;border:none;stroke:var(--text-color);cursor:pointer;position:absolute;top:12px;right:12px;width:25px;height:23px;display:grid;justify-content:center;align-content:center}
.dialogs.svelte-1r4nvsh{position:relative;top:50px;left:50px;width:calc(100vw - 100px)}.backdrop.svelte-1r4nvsh{background:rgba(0, 0, 0, 0.6);border:none;cursor:pointer;width:100vw;height:100vh;position:fixed;top:0;left:0;z-index:var(--z-modal-dialog-backdrop)}.dialog.svelte-1r4nvsh{background:var(--dialog-bg-color);box-shadow:0 2px 16px rgba(0, 0, 0, 0.4);border-radius:14px;color:var(--text-color);padding:36px 42px;margin:0 auto 40px;position:relative;width:100%;max-width:820px;transform-origin:50% 100%;box-sizing:border-box;z-index:var(--z-modal-dialogs)}.dialog-title.svelte-1r4nvsh{font-size:24px;font-weight:var(--bold-weight);line-height:140%;margin:0 0 14px}@media(max-width: 480px){.dialogs.svelte-1r4nvsh{left:2px;top:calc(env(safe-area-inset-top, 0px) + 2px);width:calc(100% - 4px)}.dialog.svelte-1r4nvsh{border-radius:4px;min-height:calc(100vh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));margin:0 0 60px;padding:0 24px 40px}.dialog-title.svelte-1r4nvsh{padding:22px 0 0}}
.drop-target.svelte-1yaabyq{background:hsla(var(--blue-hue), 50%, 10%, 0.9);height:100vh;left:0;position:fixed;top:0;width:100vw}h1.svelte-1yaabyq{color:#fff;font-size:32px;font-weight:var(--bold-weight);left:0;margin:0;padding:0;position:fixed;text-align:center;top:30%;width:100vw}h1.svelte-1yaabyq svg{display:block;margin:14px auto;stroke:hsl(var(--blue-hue), 80%, 70%)}
.dropdown.svelte-qqifw8.svelte-qqifw8{background:var(--dropdown-bg-color);border-radius:7px;box-shadow:0 6px 24px 2px var(--drop-shadow);box-sizing:border-box;display:grid;padding:10px 0;position:absolute;transform-origin:0% 0%;z-index:var(--z-dropdowns)}.dropdown.open-from-right.svelte-qqifw8.svelte-qqifw8{transform-origin:100% 0%}.dropdown.is-fixed.svelte-qqifw8.svelte-qqifw8{position:fixed}.dropdown-search.svelte-qqifw8.svelte-qqifw8{padding:0 8px 6px}.list.svelte-qqifw8 .caption.svelte-qqifw8{padding:3px 16px 4px;font-size:14px;font-weight:var(--bold-weight);color:var(--text-color-dull)}.list.svelte-qqifw8 .caption.svelte-qqifw8 .swatch{margin-right:3px}.list.svelte-qqifw8 .item.svelte-qqifw8{background:none;border:none;color:var(--text-color);cursor:pointer;display:block;font-size:16px;font-weight:var(--regular-weight);padding:4px 16px;text-align:left;width:100%;outline:none;box-sizing:border-box;text-decoration:none}.list.svelte-qqifw8 .item.selected.svelte-qqifw8,.list.svelte-qqifw8 .item.selected.svelte-qqifw8:hover,.list.svelte-qqifw8 .item.selected.svelte-qqifw8:focus{background:var(--dropdown-selected-item-bg-color);color:var(--text-color-bright)}.list.svelte-qqifw8 .item.svelte-qqifw8 svg{margin:0 3px;opacity:0.5}.list.svelte-qqifw8 .item.svelte-qqifw8 .avatar{position:absolute;top:11px;left:11px}.list.svelte-qqifw8 .item.svelte-qqifw8:hover,.list.svelte-qqifw8 .item.svelte-qqifw8:focus{background:var(--dropdown-hover-item-bg-color);color:var(--text-color-bright)}.list.grid.svelte-qqifw8.svelte-qqifw8{display:grid;grid-template-columns:repeat(auto-fill, minmax(40px, 1fr));grid-gap:2px;padding:0 10px}.list.grid.svelte-qqifw8 .item.svelte-qqifw8{display:flex;flex-direction:column;align-items:center;justify-content:center;height:40px;width:40px;padding:0;border-radius:4px}.item.has-emoji.svelte-qqifw8.svelte-qqifw8{padding-left:42px;position:relative}.item.has-avatar.svelte-qqifw8.svelte-qqifw8{padding-left:50px;position:relative}.item.has-emoji.svelte-qqifw8 .item-emoji.svelte-qqifw8{position:absolute;left:14px;top:7px;font-size:18px}.dropdown-title.svelte-qqifw8.svelte-qqifw8{font-size:14px;color:var(--text-color-dull);margin:2px 15px 10px}.dropdown-footer.svelte-qqifw8.svelte-qqifw8{font-size:12px;color:var(--text-color-dull);margin:12px 10px 2px}.list.svelte-qqifw8 hr.svelte-qqifw8{border:none;border-top:1px solid var(--border-color-dull);margin:6px 0}.item-note.svelte-qqifw8.svelte-qqifw8{font-size:13px;line-height:135%;font-weight:var(--regular-weight);color:var(--text-color-dull);margin-top:-2px}.item.svelte-qqifw8+.caption.svelte-qqifw8{border-top:1px solid var(--border-color-dull);margin-top:12px;padding-top:16px}
.empty-state.svelte-1467ebs.svelte-1467ebs{background:var(--card-bg-color);box-shadow:0 2px 6px 0px var(--drop-shadow-dull);border-radius:30px;margin:80px auto;padding:40px 60px;max-width:480px;text-align:center;box-sizing:border-box}.emoji.svelte-1467ebs.svelte-1467ebs{margin:20px 0 30px;font-size:48px}.icon.svelte-1467ebs.svelte-1467ebs{margin:4px 0 26px}p.svelte-1467ebs.svelte-1467ebs{font-size:17px;line-height:145%}@media(max-width: 640px){.empty-state.svelte-1467ebs.svelte-1467ebs{border-radius:15px;margin:28px auto;padding:20px 40px}.empty-state.svelte-1467ebs p.svelte-1467ebs{font-size:16px}}
h3.svelte-1wlxws1{margin:0 0 10px;text-align:left}p.svelte-1wlxws1{margin-top:10px;margin-bottom:2px}.help-card.svelte-1wlxws1{position:relative;padding-left:50px}.emoji.svelte-1wlxws1{font-size:32px;line-height:100%;width:36px;text-align:center;position:absolute;left:0;top:2px}
.outer-container.svelte-1tpwxzt{display:grid;margin:0 auto;text-align:center;min-height:100vh;align-content:center;gap:24px}.logo.svelte-1tpwxzt{font-size:40px;font-weight:var(--bold-weight);line-height:46px}.tagline.svelte-1tpwxzt{font-size:24px;line-height:24px;margin:0 0 8px}.actions.svelte-1tpwxzt{display:grid;gap:18px;grid-auto-flow:column;justify-content:center}
p.svelte-1dvzf5w{margin:8px 0 8px}
.actions-dropdown-button.svelte-xbavhd{background:none;border:none;box-sizing:border-box;cursor:pointer;padding:0;position:relative;height:40px;width:40px}.actions-dropdown-button.svelte-xbavhd svg{opacity:0.5;stroke:var(--text-color)}.actions-dropdown-button.svelte-xbavhd:hover svg{opacity:1}
p.note.svelte-f703t7{font-size:17px;line-height:140%;margin:8px 0 20px}.users.svelte-f703t7{display:grid;grid-gap:8px}.user.svelte-f703t7{align-items:center;display:grid;grid-gap:12px;grid-template-columns:48px 1fr 1fr 1fr 100px 50px;justify-items:start;margin:2px 0}.user-name.svelte-f703t7{font-weight:var(--bold-weight)}.user-email.svelte-f703t7{font-weight:var(--regular-weight);font-size:14px;color:var(--text-color-dull)}.invite-date.svelte-f703t7{font-size:14px;color:var(--text-color-dull);font-weight:var(--regular-weight)}.invite-swatch.svelte-f703t7{background:#ccc;display:inline-grid;width:48px;height:48px;align-items:center;justify-items:center;border-radius:8px;margin:2px 0 0 0}.empty-state.svelte-f703t7{color:var(--text-color-dull);font-size:16px}.users.svelte-f703t7 .actions-dropdown-button{margin:0 auto}@media(max-width: 750px){.user.svelte-f703t7{grid-template-columns:48px 1fr 50px}.user-role.svelte-f703t7{display:none}}
.backdrop.svelte-118w7y.svelte-118w7y{background:rgba(0, 0, 0, 0.8);border:none;cursor:pointer;width:100vw;height:100vh;position:fixed;top:0;left:0;z-index:var(--z-lightbox-backdrop)}.image.svelte-118w7y.svelte-118w7y{cursor:pointer;position:fixed;top:30px;left:30px;width:calc(100vw - 60px);height:calc(100vh - 60px);box-sizing:border-box;display:grid;justify-content:center;align-items:center;align-content:center;justify-items:center;z-index:var(--z-lightbox)}.image.svelte-118w7y img.svelte-118w7y{box-shadow:0 4px 8px rgba(0, 0, 0, 0.25);border-radius:4px;display:block;max-height:100%;max-width:100%;position:absolute}.caption.svelte-118w7y.svelte-118w7y{margin:8px 0}
.flash.svelte-1g2a5o1.svelte-1g2a5o1{padding:0 30px 30px 30px;max-width:380px;margin:0;box-sizing:border-box}.message.svelte-1g2a5o1.svelte-1g2a5o1{font-size:15px;font-weight:var(--bold-weight);line-height:145%;padding:10px 20px;width:fit-content;margin:0 auto;border-radius:12px;position:relative}.talk-bubble.svelte-1g2a5o1.svelte-1g2a5o1{border-radius:0 0 100% 0;bottom:-12px;height:16px;left:18px;position:absolute;transform:rotate(18deg);width:8px}.server.svelte-1g2a5o1.svelte-1g2a5o1{position:absolute;left:-13px;bottom:-36px;color:var(--text-color)}@keyframes svelte-1g2a5o1-blinking{0%{height:6px;top:7px}35%{height:6px;top:7px}36%{height:0;top:11px}37%{height:6px;top:7px}95%{height:6px;top:7px}96%{height:0;top:11px}97%{height:6px;top:7px}}.eye.svelte-1g2a5o1.svelte-1g2a5o1{background:var(--text-color);border-radius:50%;position:absolute;width:3px;height:6px;animation-name:svelte-1g2a5o1-blinking;animation-duration:8s;animation-iteration-count:infinite}.eye.left.svelte-1g2a5o1.svelte-1g2a5o1{left:7px;top:7px}.eye.right.svelte-1g2a5o1.svelte-1g2a5o1{left:14px;top:7px}.success.svelte-1g2a5o1.svelte-1g2a5o1,.success.svelte-1g2a5o1 .talk-bubble.svelte-1g2a5o1{background:var(--flash-success-bg-color);color:var(--flash-text-color)}.info.svelte-1g2a5o1.svelte-1g2a5o1,.info.svelte-1g2a5o1 .talk-bubble.svelte-1g2a5o1{background:var(--flash-info-bg-color);color:var(--flash-text-color)}.error.svelte-1g2a5o1.svelte-1g2a5o1,.error.svelte-1g2a5o1 .talk-bubble.svelte-1g2a5o1{background:var(--flash-error-bg-color);color:var(--flash-text-color)}
.tabs.svelte-b82z5a{border-bottom:1px solid var(--border-color);display:grid;justify-content:space-between;grid-auto-flow:column;margin:0}button.svelte-b82z5a{background:transparent;border:0;color:var(--text-color-dull);font-weight:var(--regular-weight);padding:8px 16px;margin:0}button.active.svelte-b82z5a{border-bottom:2px solid var(--border-color-bright);color:var(--text-color-bright);font-weight:var(--bold-weight);position:relative;top:1px}
.login-page.svelte-1sp0urf.svelte-1sp0urf{margin:0 auto;max-width:460px;position:relative;z-index:1}.login-page.svelte-1sp0urf .card{padding:22px 28px 24px 28px}.logo.svelte-1sp0urf.svelte-1sp0urf{font-size:40px;font-weight:var(--bold-weight);line-height:46px;display:grid;justify-items:center;padding:100px 0 35px;text-align:center}.logo.svelte-1sp0urf a.svelte-1sp0urf{color:var(--text-color);text-decoration:none}.logo.svelte-1sp0urf a.svelte-1sp0urf:hover,.logo.svelte-1sp0urf a.svelte-1sp0urf:focus{color:var(--text-color-bright);text-decoration:none}.login-tabs.svelte-1sp0urf.svelte-1sp0urf{margin:0 0 20px}h1.svelte-1sp0urf.svelte-1sp0urf{font-size:22px;line-height:120%;margin:0 0 12px;text-align:center}.login-page.svelte-1sp0urf .textfield.has-label{display:block}.login-page.svelte-1sp0urf .textfield.has-label input{width:100%}
.mini-nav.svelte-1r53h3j.svelte-1r53h3j{position:fixed;top:0;left:0;box-sizing:border-box;padding:12px;z-index:var(--z-nav)}.button.svelte-1r53h3j.svelte-1r53h3j{background:none;stroke:var(--text-color);cursor:pointer;display:grid;padding:6px;margin:0;align-items:center;outline:none;border-radius:6px}.button.svelte-1r53h3j.svelte-1r53h3j:hover,.button.svelte-1r53h3j.svelte-1r53h3j:focus{background:var(--button-bg-color-hover)}.toggle-button.svelte-1r53h3j.svelte-1r53h3j{border:1px solid var(--border-color-dull)}.close-nav.svelte-1r53h3j.svelte-1r53h3j{stroke:var(--text-color-very-dull);position:absolute;top:6px;right:6px}.overlay.svelte-1r53h3j.svelte-1r53h3j{background:var(--nav-overlay-bg-color);position:fixed;top:0;left:0;width:100vw;height:100vh;opacity:1;transition:opacity 180ms ease;z-index:var(--z-nav-overlay)}.overlay.closed.svelte-1r53h3j.svelte-1r53h3j{opacity:0}.actual-nav.svelte-1r53h3j.svelte-1r53h3j{position:fixed;top:18px;left:0;background:var(--page-bg-color);box-sizing:border-box;padding:30px 8px;border-radius:0 10px 10px 0;box-shadow:0 0 8px rgba(0, 0, 0, 0.12);transform:translate3d(0, 0, 0);opacity:1;transition:transform 180ms ease, opacity 180ms ease;width:200px;z-index:var(--z-nav);will-change:transform, opacity;user-select:none}.actual-nav.closed.svelte-1r53h3j.svelte-1r53h3j{transform:translate3d(-40px, 0, 0);opacity:0}.section.svelte-1r53h3j a.svelte-1r53h3j,.button-as-link.svelte-1r53h3j.svelte-1r53h3j{background:transparent;box-sizing:border-box;display:grid;border:0;grid-template-columns:26px 1fr;color:var(--text-color);gap:4px;font-weight:var(--font-weight-regular);stroke:var(--text-color-dull);padding:4px 6px;border-radius:4px;align-items:center;justify-items:start;width:100%;font-size:15px;line-height:140%}.section.svelte-1r53h3j a.svelte-1r53h3j:hover,.section.svelte-1r53h3j a.svelte-1r53h3j:focus,.button-as-link.svelte-1r53h3j.svelte-1r53h3j:hover,.button-as-link.svelte-1r53h3j.svelte-1r53h3j:focus{background:var(--nav-link-bg-color-focus);color:var(--text-color-bright);text-decoration:none}.section.svelte-1r53h3j .icon.svelte-1r53h3j{display:grid;justify-items:center;align-items:center;stroke:var(--text-color-very-dull);margin:0 auto}.section.svelte-1r53h3j a:hover .icon.svelte-1r53h3j,.section.svelte-1r53h3j a:focus .icon.svelte-1r53h3j{stroke:var(--text-color)}.pages.svelte-1r53h3j.svelte-1r53h3j{display:grid;grid-auto-flow:row;margin:16px 0 20px}.other-links.svelte-1r53h3j.svelte-1r53h3j{display:grid;grid-auto-flow:row}.other-links.svelte-1r53h3j a.svelte-1r53h3j{align-content:center;justify-content:start;fill:var(--text-color);stroke:var(--text-color)}h3.section-header.svelte-1r53h3j.svelte-1r53h3j{color:var(--text-color-dull);font-weight:var(--regular-weight);padding:0 10px;margin:1px 0;font-size:14px;line-height:140%}
.container.svelte-lvr2yt{display:grid;width:100vw;height:100vh;justify-items:center;align-content:center}.home-page.svelte-lvr2yt{box-sizing:border-box;color:var(--text-color);max-width:560px;display:grid;grid-gap:20px;align-content:center;justify-items:center;text-align:center;padding:0 30px;position:relative;top:-20px}.logo.svelte-lvr2yt{color:var(--text-color-bright);font-size:40px;font-weight:var(--bold-weight);display:grid;grid-auto-flow:column;align-items:center;justify-content:start;grid-gap:0 6px}h2.svelte-lvr2yt{color:var(--text-color);line-height:140%;margin:0;font-weight:var(--regular-weight);font-size:24px}@media(max-width: 640px){.home-page.svelte-lvr2yt{top:-30px}h2.svelte-lvr2yt{font-size:22px}}
.breadcrumbs.svelte-1e4bdui{margin:0 0 16px;font-size:15px;font-weight:var(--bold-weight)}.breadcrumbs.svelte-1e4bdui svg{display:inline-block;margin:0 7px 0 -2px;opacity:0.6;position:relative;top:1px}
.scroll-parent.svelte-1ap8ibn{position:fixed;top:0;left:0;width:100vw;height:100vh;height:-webkit-fill-available;height:100dvh;overflow:hidden auto;will-change:scroll-position;transition:filter 180ms ease}.page.svelte-1ap8ibn{box-sizing:border-box;padding:22px 20px calc(260px + env(safe-area-inset-bottom, 0px));transform:translate3d(0, 0, 0);opacity:1;transition:transform 250ms cubic-bezier(0, 0, 0, 1), opacity 250ms}.page.center.svelte-1ap8ibn{opacity:0}.page.right.svelte-1ap8ibn{transform:translate3d(60px, 0, 0);opacity:0}.page.left.svelte-1ap8ibn{transform:translate3d(-60px, 0, 0);opacity:0}@media(max-width: 800px){.page.svelte-1ap8ibn{padding-top:calc(112px + env(safe-area-inset-bottom, 0px))}}@media(min-width: 801px){.page.svelte-1ap8ibn{padding-left:32px;padding-right:32px}.page.right.svelte-1ap8ibn{transform:translate3d(48px, 0, 0)}.page.left.svelte-1ap8ibn{transform:translate3d(-48px, 0, 0)}}
.drag-handle.svelte-b10t7f{position:absolute;cursor:grab;opacity:0;background:transparent;border:none;padding:0;width:30px;height:30px;transition:opacity 150ms ease}.drag-handle.svelte-b10t7f svg{stroke:var(--text-color-very-dull)}.drag-handle.hovering.svelte-b10t7f{opacity:0.6}
.line-controls-row.svelte-1ridrx2{background:var(--page-bg-color);position:fixed;top:0;left:0;width:calc(100vw - 18px);height:54px;display:grid;align-items:center;justify-items:center;z-index:var(--z-line-controls)}.line-controls.svelte-1ridrx2{align-items:stretch;display:grid;gap:8px;grid-auto-flow:column;justify-content:start;margin:0;width:330px}.page-settings.svelte-1ridrx2{background:transparent;border:0;padding:0;margin:0;stroke:var(--text-color);cursor:pointer;position:absolute;right:2px;top:10px;width:30px;height:30px;display:grid;align-items:center;justify-items:center}@media(max-width: 400px){.line-controls.svelte-1ridrx2{width:calc(100% - 110px)}}
.badge.svelte-17c08jr{border-radius:12px;display:inline-block;font-weight:var(--regular-weight);line-height:100%;margin:0;text-align:center;cursor:default}.badge.medium.svelte-17c08jr{font-size:13px;padding:7px 12px}.badge.large.svelte-17c08jr{border-radius:13px;font-size:15px;padding:9px 14px}.badge.x-large.svelte-17c08jr{border-radius:14px;font-size:17px;padding:9px 14px}.badge.is-disabled.svelte-17c08jr{opacity:0.5;text-decoration:line-through}.badge.gray.svelte-17c08jr{background:var(--badge-gray-bg-color);color:var(--badge-gray-text-color)}.badge.blue.svelte-17c08jr{background:var(--badge-blue-bg-color);color:var(--badge-blue-text-color)}.badge.yellow.svelte-17c08jr{background:var(--badge-yellow-bg-color);color:var(--badge-yellow-text-color)}.badge.orange.svelte-17c08jr{background:var(--badge-orange-bg-color);color:var(--badge-orange-text-color)}.badge.green.svelte-17c08jr{background:var(--badge-green-bg-color);color:var(--badge-green-text-color)}.badge.red.svelte-17c08jr{background:var(--badge-red-bg-color);color:var(--badge-red-text-color)}
.parent.svelte-j8acvt{width:100%}label.svelte-j8acvt{color:var(--text-color-dull);font-size:14px;line-height:150%}textarea.svelte-j8acvt{background:var(--input-bg-color);border-radius:5px;border:1px solid var(--input-border-color);box-sizing:border-box;color:var(--text-color);display:block;font-size:16px;padding:8px 10px;min-height:60px;overflow:hidden;resize:none;transition:color 150ms ease, border-color 150ms ease, box-shadow 150ms ease;width:100%;-webkit-tap-highlight-color:transparent}textarea.svelte-j8acvt:hover{border:1px solid var(--input-border-hover)}textarea.svelte-j8acvt:active,textarea.svelte-j8acvt:focus{box-shadow:0 0 1px var(--input-border-focus);border:1px solid var(--input-border-focus);outline:none}textarea.h1.svelte-j8acvt{background:transparent;border-color:transparent;border-radius:6px;font-size:30px;font-weight:var(--bold-weight);padding:0}textarea.h1.svelte-j8acvt:hover{box-shadow:none;border-color:transparent}textarea.h1.svelte-j8acvt:active,textarea.h1.svelte-j8acvt:focus{box-shadow:none;border-color:transparent}textarea.h2.svelte-j8acvt{background:transparent;border:1px solid transparent;font-size:22px;font-weight:var(--bold-weight);padding:6px 10px}textarea.h2.svelte-j8acvt:hover,textarea.h2.svelte-j8acvt:active,textarea.h2.svelte-j8acvt:focus{border-color:transparent;box-shadow:none}textarea.borderless.svelte-j8acvt{background:transparent;border:1px solid transparent;padding:5px 10px}textarea.borderless.svelte-j8acvt:hover,textarea.borderless.svelte-j8acvt:active,textarea.borderless.svelte-j8acvt:focus{border-color:transparent;box-shadow:none}
.page-title.svelte-19ae9mz{margin:78px 0 30px;padding-left:60px}.archived-banner.svelte-19ae9mz{margin:0 0 20px -4px}
.parent.svelte-1rxntcu.svelte-1rxntcu{position:relative;margin:0 auto;max-width:560px;left:-15px}.parent.dragging.svelte-1rxntcu.svelte-1rxntcu{cursor:grabbing}.parent.dragging.svelte-1rxntcu button.svelte-1rxntcu{cursor:grabbing !important}.parent.dragging.svelte-1rxntcu .drag-handle{display:none !important}@media(max-width: 720px){.parent.svelte-1rxntcu.svelte-1rxntcu{max-width:350px}}@media(max-width: 900px){.parent.svelte-1rxntcu.svelte-1rxntcu{max-width:420px}}.editor-parent.svelte-1rxntcu.svelte-1rxntcu{position:relative}.bottom-of-page.svelte-1rxntcu.svelte-1rxntcu{background:transparent;border:0;padding:0;margin:-2px 0 0;width:100%;height:500px;cursor:text;outline:none}.line-ui.svelte-1rxntcu.svelte-1rxntcu{position:absolute;top:0;left:0;z-index:2;user-select:none;-webkit-user-select:none;width:0}.line-ui.svelte-1rxntcu .line.svelte-1rxntcu{pointer-events:none;user-select:none;-webkit-user-select:none;opacity:0;visibility:hidden}.line-row.svelte-1rxntcu+.line-row.type-h1.svelte-1rxntcu{margin-top:16px}.line-row.svelte-1rxntcu.svelte-1rxntcu{position:relative;transition:transform 150ms ease}.line-row.drag-target.svelte-1rxntcu.svelte-1rxntcu{box-shadow:0 2px 0 var(--input-border-focus)}.line-row.dragging.svelte-1rxntcu.svelte-1rxntcu{pointer-events:none}.line-ui.svelte-1rxntcu .line-row.dragging .line.svelte-1rxntcu{opacity:0}.line.dragover.svelte-1rxntcu.svelte-1rxntcu{box-shadow:0 3px 0 0 var(--input-border-focus)}.line-row.svelte-1rxntcu .checkbox.svelte-1rxntcu{position:absolute;top:-1px;left:0;cursor:pointer;display:grid;align-items:center;justify-items:start;justify-content:center;background:transparent;color:var(--text-color-dull);width:28px;box-sizing:border-box;height:28px;margin-left:-6px}.editor.svelte-1rxntcu.svelte-1rxntcu{position:relative;outline:none;z-index:2}.line.svelte-1rxntcu.svelte-1rxntcu{padding:3px 0;min-height:30px;box-sizing:border-box;margin:1px 0;white-space:pre-wrap;overflow-wrap:break-word;outline:none}.line.start-selection.svelte-1rxntcu.svelte-1rxntcu{box-shadow:0 0 0 2px hsla(var(--blue-hue), 100%, 50%, 0.3)}.line.end-selection.svelte-1rxntcu.svelte-1rxntcu{box-shadow:0 0 0 2px hsla(var(--red-hue), 100%, 50%, 0.3)}.line-h1.svelte-1rxntcu.svelte-1rxntcu{font-size:22px;font-weight:var(--bold-weight);line-height:30px}.line-h1.collapsed.svelte-1rxntcu.svelte-1rxntcu{margin-bottom:34px}.collapsed-actions.svelte-1rxntcu.svelte-1rxntcu{bottom:-24px;left:0;position:absolute;width:280px;display:grid;justify-items:start;align-items:center}.collapsed-count.svelte-1rxntcu.svelte-1rxntcu{background:transparent;border:1px dashed var(--border-color-dull);color:var(--text-color-very-dull);font-size:14px;font-weight:var(--regular-weight);padding:3px 8px;border-radius:4px;cursor:pointer}.line-h2.svelte-1rxntcu.svelte-1rxntcu{font-size:14px;color:var(--text-color);text-transform:uppercase}.line-h3.svelte-1rxntcu.svelte-1rxntcu{font-size:15px;font-weight:var(--bold-weight);color:var(--text-color)}.line-list.svelte-1rxntcu.svelte-1rxntcu{margin:0 0 -1px}.line.svelte-1rxntcu+.line.line-h1.svelte-1rxntcu{margin-top:16px}.line.svelte-1rxntcu+.line.line-h2.svelte-1rxntcu{margin-top:10px}.line.svelte-1rxntcu+.line.line-h3.svelte-1rxntcu{margin-top:10px}.line-row.svelte-1rxntcu+.line-row.type-h2.svelte-1rxntcu{margin-top:10px}.line-row.svelte-1rxntcu+.line-row.type-h3.svelte-1rxntcu{margin-top:10px}.line.line-task.shelved.svelte-1rxntcu.svelte-1rxntcu{color:var(--text-color-very-dull);text-decoration-line:line-through;-webkit-text-decoration-line:line-through;text-decoration-color:var(--text-color-very-dull);;;-webkit-text-decoration-color:var(--text-color-very-dull);opacity:0.9}.checkbox.svelte-1rxntcu svg.icon-circle-slash{fill:var(--text-color-very-dull);opacity:0.4}.checkbox.svelte-1rxntcu svg.icon-circle-slash line{stroke:var(--page-bg-color)}.line.line-hr.svelte-1rxntcu.svelte-1rxntcu{position:relative;top:-12px;border-bottom:1px solid var(--border-color);caret-color:transparent;margin:10px 0}.line.current-line.line-hr.svelte-1rxntcu.svelte-1rxntcu{border-bottom:1px solid var(--input-border-focus);box-shadow:0px 1px 0px 0px var(--input-border-focus), 0px -1px 0px 0px var(--input-border-focus) inset}.line-row.svelte-1rxntcu .header-caret.svelte-1rxntcu{transform:rotate(0deg);transition:transform 150ms ease;background:transparent;display:grid;align-items:center;justify-items:center;width:32px;height:32px;margin:0;padding:0;user-select:none;position:absolute;left:-32px;top:0}.line-row.svelte-1rxntcu .header-caret.svelte-1rxntcu svg{stroke:var(--text-color-very-dull)}.line-row.svelte-1rxntcu .bullet.svelte-1rxntcu{position:absolute;top:0;left:0;width:24px;height:20px;display:grid;align-items:center;justify-items:center;color:var(--text-color);font-size:30px;line-height:20px;user-select:none;pointer-events:none}.line-row.collapsed.svelte-1rxntcu .header-caret.svelte-1rxntcu{transform:rotate(-90deg)}.line-row.svelte-1rxntcu .line.line-h1.svelte-1rxntcu{min-height:34px}.line.svelte-1rxntcu.svelte-1rxntcu:empty:after{content:attr(placeholder);color:var(--placeholder-color)}.parent.is-archived.svelte-1rxntcu .editor-parent.svelte-1rxntcu,.parent.is-archived.svelte-1rxntcu .bottom-of-page.svelte-1rxntcu{pointer-events:none}
.panel.svelte-u8jcxw.svelte-u8jcxw{background:var(--panel-bg-color);border-radius:7px;box-shadow:0 6px 24px 2px var(--drop-shadow);box-sizing:border-box;display:grid;padding:10px 0;position:absolute;transform-origin:0% 0%;z-index:var(--z-panel)}.panel.open-from-right.svelte-u8jcxw.svelte-u8jcxw{transform-origin:100% 0%}.panel.is-fixed.svelte-u8jcxw.svelte-u8jcxw{position:fixed}.panel.svelte-u8jcxw .has-max-height.svelte-u8jcxw{overflow-y:scroll}.panel-title.svelte-u8jcxw.svelte-u8jcxw{font-size:14px;color:var(--text-color-dull);margin:2px 15px 10px}.panel-footer.svelte-u8jcxw.svelte-u8jcxw{font-size:12px;color:var(--text-color-dull);margin:12px 10px 2px}
.form-group.svelte-dh6o0x.svelte-dh6o0x{display:grid;grid-gap:14px;margin:0 0 12px}.form-group.svelte-dh6o0x .actions{margin:12px 0 16px}.input-note.svelte-dh6o0x.svelte-dh6o0x{color:var(--text-color-very-dull);font-size:14px;margin:2px 0 0;padding-left:102px}.account-row.svelte-dh6o0x.svelte-dh6o0x{align-items:center;display:grid;grid-template-columns:1fr 100px 140px;justify-items:start;padding:6px 0}.account-row.svelte-dh6o0x+.account-row.svelte-dh6o0x{border-top:1px solid var(--border-color-dull)}.account-row.svelte-dh6o0x .button.primary{pointer-events:none}.account-row.selected.svelte-dh6o0x.svelte-dh6o0x{font-weight:var(--bold-weight)}.swatch-parent.svelte-dh6o0x.svelte-dh6o0x{border-radius:4px;background:var(--input-bg-color);padding:6px 8px;display:grid;align-items:center;justify-items:center}
.users.svelte-1p7luxs{display:grid;grid-gap:8px}.user.svelte-1p7luxs{align-items:center;display:grid;grid-gap:12px;grid-template-columns:48px 1fr 1fr 1fr 130px 50px;justify-items:start;margin:2px 0}.user-name.svelte-1p7luxs{font-weight:var(--bold-weight)}.avatar.svelte-1p7luxs{margin:2px 0 0 0}
.filter-controls.svelte-eabs30.svelte-eabs30{margin:16px 0 20px}.group-title.svelte-eabs30.svelte-eabs30{margin:4px 0 -12px;font-size:16px;font-weight:var(--bold-weight)}.group-title.svelte-eabs30 .dull.svelte-eabs30{font-size:16px;line-height:16px;margin:0 2px}.users.svelte-eabs30.svelte-eabs30{display:grid;grid-gap:8px}.user.svelte-eabs30.svelte-eabs30{align-items:center;display:grid;grid-gap:12px;grid-template-columns:48px 1fr 1fr 1fr 130px 50px;justify-items:start;margin:2px 0}.user-name.svelte-eabs30.svelte-eabs30{font-weight:var(--bold-weight)}.avatar.svelte-eabs30.svelte-eabs30{margin:2px 0 0 0}.users.svelte-eabs30 .actions-dropdown-button{margin:0 auto}.disabled-users-button.svelte-eabs30.svelte-eabs30{margin-top:24px}@media(max-width: 750px){.user.svelte-eabs30.svelte-eabs30{grid-template-columns:48px 1fr 50px;align-items:start}}
.toasts.svelte-1i5orr5{position:fixed;bottom:calc(env(safe-area-inset-bottom) + 18px);right:calc(env(safe-area-inset-right) + 14px);z-index:var(--z-toasts)}.toast.svelte-1i5orr5{border:none;border-radius:8px;box-shadow:-86px 0 0 -42px var(--toast-sidebar-bg) inset, 0 2px 4px var(--drop-shadow), 0 0 0 1px var(--border-color-dull) inset;box-sizing:border-box;font-size:16px;margin:8px 0;padding:17px 62px 17px 20px;position:relative;width:330px}.error.svelte-1i5orr5{background:var(--toast-bg-error);color:var(--toast-color-error)}.alert.svelte-1i5orr5{background:var(--toast-bg-alert);color:var(--toast-color-alert)}.action.svelte-1i5orr5{margin:6px 0 0}.info.svelte-1i5orr5{background:var(--toast-bg-info);color:var(--toast-color-info)}.success.svelte-1i5orr5{background:var(--toast-bg-success);color:var(--toast-color-success)}.title.svelte-1i5orr5{font-weight:var(--bold-weight);font-size:16px;margin:0 0 7px}.footer.svelte-1i5orr5{font-size:13px;margin:10px 0 0;opacity:0.7}.close-parent.svelte-1i5orr5{position:absolute;top:0;right:0;width:44px;height:100%;display:grid}.close.svelte-1i5orr5{background:none;border:none;stroke:var(--text-color);cursor:pointer;opacity:0.5;width:100%;height:100%;display:grid;justify-content:center;align-items:top;padding-top:14px}.close.svelte-1i5orr5 svg.icon-x{stroke-width:3px}.close.svelte-1i5orr5:hover{opacity:1}@media(max-width: 800px){.toasts.svelte-1i5orr5{bottom:calc(env(safe-area-inset-bottom) + 80px)}}
.tooltip-parent.svelte-1mqfg16{display:grid;justify-items:center;position:absolute;z-index:var(--z-tooltips)}.tooltip-arrow.svelte-1mqfg16{position:absolute;bottom:-7px;left:calc(50% - 6px);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:7px solid var(--tooltip-bg-color)}.tooltip.svelte-1mqfg16{background-color:var(--tooltip-bg-color);border-radius:12px;bottom:0;box-shadow:0 2px 4px var(--drop-shadow);box-sizing:border-box;color:var(--tooltip-text-color);font-size:14px;line-height:145%;padding:8px 14px;pointer-events:none;position:absolute;text-align:center;white-space:normal}.top-emoji.svelte-1mqfg16{font-size:48px;line-height:100%;margin:8px 0 6px}.title.svelte-1mqfg16{color:var(--tooltip-text-color-bright);font-size:16px;font-weight:var(--bold-weight);margin:4px 0}
.welcome-page.svelte-gdze4j.svelte-gdze4j{margin:0 auto;max-width:500px;padding:80px 20px 40px;text-align:center}h1.svelte-gdze4j.svelte-gdze4j{font-size:30px;line-height:120%;margin:12px 0;text-align:center}h2.svelte-gdze4j.svelte-gdze4j{line-height:130%;font-size:22px;margin:12px 0 36px}.welcome-page.svelte-gdze4j .card{padding:14px 28px 30px 28px}.welcome-page.svelte-gdze4j button{margin:0 auto}.consent-form.svelte-gdze4j.svelte-gdze4j{display:grid;align-items:center;border-radius:12px;border:1px solid var(--border-color-dull);font-size:14px;grid-gap:18px;grid-template-columns:20px auto;justify-items:start;line-height:145%;padding:14px 20px;text-align:left}.consent-form.svelte-gdze4j input.svelte-gdze4j,.consent-form.svelte-gdze4j label.svelte-gdze4j{cursor:pointer}.consent-form.svelte-gdze4j input.svelte-gdze4j{height:20px;width:20px}@media(max-width: 640px){.welcome-page.svelte-gdze4j.svelte-gdze4j{padding:36px 16px}}
main.svelte-gosxa7.svelte-gosxa7{background:var(--page-bg-color);min-height:100vh}.ios-header.svelte-gosxa7.svelte-gosxa7{background:var(--ios-header-bg-color);height:env(safe-area-inset-top, 0px);position:absolute;top:0;left:0;width:100vw;z-index:var(--z-ios-header)}.fixed-header.svelte-gosxa7.svelte-gosxa7{background:var(--ios-header-bg-color);position:fixed;z-index:var(--z-ios-header)}.fixed-ios-header.svelte-gosxa7.svelte-gosxa7{height:env(safe-area-inset-top, 0px);top:0;left:0;width:100vw}.fixed-ios-footer.svelte-gosxa7.svelte-gosxa7{height:env(safe-area-inset-bottom, 0px);bottom:0;left:0;width:100vw}.fixed-ios-left-sidebar.svelte-gosxa7.svelte-gosxa7{width:env(safe-area-inset-left, 0px);top:0;left:0;height:100vh}.fixed-ios-right-sidebar.svelte-gosxa7.svelte-gosxa7{width:env(safe-area-inset-right, 0px);top:0;right:0;height:100vh}@media(min-width: 801px){.app-parent.svelte-gosxa7.svelte-gosxa7{align-items:start;display:grid;grid-template-columns:calc(var(--nav-width) + env(safe-area-inset-left, 0px)) 1fr env(safe-area-inset-left, 0px);justify-content:start;margin:0}}.app-parent.svelte-gosxa7.svelte-gosxa7{overflow:hidden;min-height:100vh}.has-dialogs.svelte-gosxa7 .app-parent.svelte-gosxa7{overflow:visible;position:fixed;top:env(safe-area-inset-top, 0px);left:0;width:100vw}.magic-link-parent.svelte-gosxa7.svelte-gosxa7{padding:40px 0}.loading.svelte-gosxa7.svelte-gosxa7{width:100vw;display:grid;position:fixed;top:0;left:0;height:60vh;align-items:center;justify-items:center}@media(max-width: 800px){.native-ui main.svelte-gosxa7.svelte-gosxa7{border-radius:4px 4px 0 0}}
