.h0 {
  font-size: 48px; }

.h1 {
  font-size: 32px; }

.h2 {
  font-size: 24px; }

.h3 {
  font-size: 20px; }

.h4 {
  font-size: 16px; }

.h5 {
  font-size: 14px; }

.h6 {
  font-size: 12px; }

.m0 {
  margin: 0px; }

.m1 {
  margin: 8px; }

.m2 {
  margin: 16px; }

.m3 {
  margin: 32px; }

.m4 {
  margin: 64px; }

.ma {
  margin: auto; }

.mt0 {
  margin-top: 0px; }

.mt1 {
  margin-top: 8px; }

.mt2 {
  margin-top: 16px; }

.mt3 {
  margin-top: 32px; }

.mt4 {
  margin-top: 64px; }

.mr0 {
  margin-right: 0px; }

.mr1 {
  margin-right: 8px; }

.mr2 {
  margin-right: 16px; }

.mr3 {
  margin-right: 32px; }

.mr4 {
  margin-right: 64px; }

.mb0 {
  margin-bottom: 0px; }

.mb1 {
  margin-bottom: 8px; }

.mb2 {
  margin-bottom: 16px; }

.mb3 {
  margin-bottom: 32px; }

.mb4 {
  margin-bottom: 64px; }

.ml0 {
  margin-left: 0px; }

.ml1 {
  margin-left: 8px; }

.ml2 {
  margin-left: 16px; }

.ml3 {
  margin-left: 32px; }

.ml4 {
  margin-left: 64px; }

.mx0 {
  margin-left: 0px;
  margin-right: 0px; }

.mx1 {
  margin-left: 8px;
  margin-right: 8px; }

.mx2 {
  margin-left: 16px;
  margin-right: 16px; }

.mx3 {
  margin-left: 32px;
  margin-right: 32px; }

.mx4 {
  margin-left: 64px;
  margin-right: 64px; }

.mxa {
  margin-left: auto;
  margin-right: auto; }

.my0 {
  margin-top: 0px;
  margin-bottom: 0px; }

.my1 {
  margin-top: 8px;
  margin-bottom: 8px; }

.my2 {
  margin-top: 16px;
  margin-bottom: 16px; }

.my3 {
  margin-top: 32px;
  margin-bottom: 32px; }

.my4 {
  margin-top: 64px;
  margin-bottom: 64px; }

.mya {
  margin-top: auto;
  margin-bottom: auto; }

.p0 {
  padding: 0px; }

.p1 {
  padding: 8px; }

.p2 {
  padding: 16px; }

.p3 {
  padding: 32px; }

.p4 {
  padding: 64px; }

.pt0 {
  padding-top: 0px; }

.pt1 {
  padding-top: 8px; }

.pt2 {
  padding-top: 16px; }

.pt3 {
  padding-top: 32px; }

.pt4 {
  padding-top: 64px; }

.pr0 {
  padding-right: 0px; }

.pr1 {
  padding-right: 8px; }

.pr2 {
  padding-right: 16px; }

.pr3 {
  padding-right: 32px; }

.pr4 {
  padding-right: 64px; }

.pb0 {
  padding-bottom: 0px; }

.pb1 {
  padding-bottom: 8px; }

.pb2 {
  padding-bottom: 16px; }

.pb3 {
  padding-bottom: 32px; }

.pb4 {
  padding-bottom: 64px; }

.pl0 {
  padding-left: 0px; }

.pl1 {
  padding-left: 8px; }

.pl2 {
  padding-left: 16px; }

.pl3 {
  padding-left: 32px; }

.pl4 {
  padding-left: 64px; }

.px0 {
  padding-left: 0px;
  padding-right: 0px; }

.px1 {
  padding-left: 8px;
  padding-right: 8px; }

.px2 {
  padding-left: 16px;
  padding-right: 16px; }

.px3 {
  padding-left: 32px;
  padding-right: 32px; }

.px4 {
  padding-left: 64px;
  padding-right: 64px; }

.py0 {
  padding-top: 0px;
  padding-bottom: 0px; }

.py1 {
  padding-top: 8px;
  padding-bottom: 8px; }

.py2 {
  padding-top: 16px;
  padding-bottom: 16px; }

.py3 {
  padding-top: 32px;
  padding-bottom: 32px; }

.py4 {
  padding-top: 64px;
  padding-bottom: 64px; }

.db {
  display: block; }

.dib {
  display: inline-block; }

.di {
  display: inline; }

.dt {
  display: table; }

.dtr {
  display: table-row; }

.dtc {
  display: table-cell; }

.df {
  display: flex; }

.dif {
  display: inline-flex; }

.fdc {
  flex-direction: column; }

.jcsb {
  justify-content: space-between; }

.jcsa {
  justify-content: space-around; }

.jcc {
  justify-content: center; }

.aic {
  align-items: center; }

.fl {
  float: left; }

.fr {
  float: right; }

.h100 {
  height: 100%; }

.w100 {
  width: 100%; }

.oh {
  overflow: hidden; }

.oa {
  overflow: auto; }

.oya {
  overflow-y: auto; }

.oxa {
  overflow-x: auto; }

.tal {
  text-align: left; }

.tac {
  text-align: center; }

.tar {
  text-align: right; }


.app-footer[data-v-63f0cb9e] {
  height: max(0.5rem, var(--safe-area-bottom));
  border-top: solid 1px var(--accent-color);
  background-color: var(--accent-color);
  display: flex;
}
.app-footer-text[data-v-63f0cb9e] {
  font-weight: bold;
  font-size: 0.8rem;
  line-height: 0.8rem;
  margin: auto;
  margin-left: 0.2rem;
}
.logout-icon[data-v-63f0cb9e] {
  display: none;
  height: 0.7rem;
  width: 0.7rem;
  padding-right: 2rem;
  margin: auto;
  user-select: none;
  cursor: pointer;
  color: var(--light-foreground-color);
}


.modal-body[data-v-76d5b2b6] {
  width: 100%;
  height: 0;
  flex: 1;
  overflow: auto;
  margin: 1rem 0;
  display: flex;
  flex-direction: row;
  gap: 1rem;
  flex-wrap: wrap;
  text-align: center;
  justify-content: center;
  position: relative;
}
.library-card[data-v-76d5b2b6]{
    width: 16rem;
    height: 9rem;
}



.header[data-v-4f525efe]{
    display: flex;
    flex-direction: column;
    position: relative;
}
.header-text[data-v-4f525efe]{
    font-size: 1.75rem;
    font-weight: bold;
    padding-top: 1rem;
    padding-left: 1rem;
    margin-bottom: -0.5rem;
}
.outer-container[data-v-4f525efe]{
    display: flex;
    flex-direction: column;
}
.main-container[data-v-4f525efe] {
  height: 0;
  flex: 1;
  overflow: auto;
  display: flex;
  flex-direction: row;
  gap: 2rem;
  padding: 1rem;
}
.library-card-outer[data-v-4f525efe] {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.library-card[data-v-4f525efe] {
  position: relative;
  height: max(min(20rem, calc(50dvh - 14rem - calc(calc(var(--safe-area-top) + var(--safe-area-bottom)) / 2))), 5rem);
  width: max(min(20rem, calc(50dvh - 14rem - calc(calc(var(--safe-area-top) + var(--safe-area-bottom)) / 2))), 5rem);
  aspect-ratio: 1;
  border-radius: 100%;
  margin-top: auto;
  margin-bottom: auto;
}
.library-card-image[data-v-4f525efe] {
  position: relative;
  background-color: var(--background-color-secondary);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.libary-card-image-background[data-v-4f525efe] {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  flex: 1;
  background-position: center;
  background-size: cover;
  opacity: 0;
  filter: blur(8px);
}
.library-card-image-inner[data-v-4f525efe] {
  border-radius: 0.5rem;
  max-width: 60%;
  max-height: 90%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 10%;
  position: relative;
  z-index: 2;
}
.text-input[data-v-4f525efe]{
    margin: 1rem;
    background-color: var(--background-color-secondary);
    border: none;
}
.circle-active-bug[data-v-4f525efe] {
  position: absolute;
  z-index: 4;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
  background-color: var(--accent-color);
  color: white;
  padding-bottom: 0.25rem;
  padding-bottom: 0.25rem;
  font-weight: bold;
  padding-top: max(min(0.5rem, 0.5vh), 0.1rem);
  font-size: max(min(2rem, 2vh), 0.5rem);
}
.my-circle-image[data-v-4f525efe] {
  width: max(min(8rem, 9vh), 1rem);
  min-width: max(min(8rem, 9vh), 1rem);
  height: max(min(8rem, 9vh), 1rem);
  min-height: max(min(8rem, 9vh), 1rem);
  margin: auto;
  border-radius: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-color: var(--background-color);
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  position: relative;
}
.tag-bug[data-v-4f525efe] {
  position: absolute;
  right: 0rem;
  top: max(min(2rem, calc(45% - 6rem)), 0rem);
  border-radius: 1rem;
  padding: 0.25rem 0.5rem;
  color: var(--background-color);
  background-color: var(--accent-color-secondary);
}
@media screen and (max-width: 1000px) {
.library-card[data-v-4f525efe] {
    position: relative;
    height: max(min(20rem, calc(50dvh - 16rem)), 5rem);
    width: max(min(20rem, calc(50dvh - 16rem)), 5rem);
    aspect-ratio: 1;
    border-radius: 100%;
    margin-top: auto;
    margin-bottom: auto;
}
.my-circle-image[data-v-4f525efe] {
    width: max(min(7rem, 8vh), 1rem);
    min-width: max(min(7rem, 8vh), 1rem);
    height: max(min(7rem, 8vh), 1rem);
    min-height: max(min(7rem, 8vh), 1rem);
}
.circle-active-bug[data-v-4f525efe]{
      font-size: 1.2vh;
      font-weight: normal;
}
}


.header[data-v-1e45a382] {
  display: flex;
  flex-direction: column;
  position: relative;
}
.header-text[data-v-1e45a382] {
  font-size: 1.75rem;
  font-weight: bold;
  padding-top: 1rem;
  padding-left: 1rem;
  margin-bottom: -0.5rem;
}
.outer-container[data-v-1e45a382] {
  display: flex;
  flex-direction: column;
}
.main-container[data-v-1e45a382] {

  overflow-x: auto;
  overflow-y: hidden;
  display: flex;
  flex-direction: row;
  gap: 1rem;
  padding: 1rem;
}
.library-card[data-v-1e45a382] {
  position: relative;
  height: calc(max(min(20rem, calc(50dvh - 16rem - calc(calc(var(--safe-area-top) + var(--safe-area-bottom)) / 2))), 5rem) + 5dvh);
  width: calc(max(min(20rem, calc(50dvh - 16rem - calc(calc(var(--safe-area-top) + var(--safe-area-bottom)) / 2))), 5rem) * 1.778);
  margin-top: auto;
  margin-bottom: auto;
}
.library-card-image[data-v-1e45a382]{
    position: relative;
    display: flex;
    flex-direction: column;
    background-size: cover;
    background: var(--background-color-secondary);
}
.library-card-image-inner[data-v-1e45a382]{
    position: relative;
    z-index: 2;
    max-height: 100%;
    max-width: 100%;
    margin: auto;
    object-fit: contain;
    border-radius: 0rem;
}
.library-card-image-background[data-v-1e45a382] {
  z-index: 1;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: cover;
  filter: blur(20px);
  opacity: 0.2;
}
.library-card-text[data-v-1e45a382] {
  flex: 1 !important;
  height: 1.5dvh !important;
  overflow: hidden;
  margin: 0.5dvh 0;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.text-input[data-v-1e45a382] {
  margin: 1rem;
  background-color: var(--background-color-secondary);
  border: none;
}


.background[data-v-12287a21] {
  background-color: var(--background-color);
  color: var(--foreground-color);
  display: flex;
  flex-direction: column;
  font-family: 'neue-haas-grotesk-display';
  justify-content: center;
  /* Same frame as the circle page: full screen, with the accent footer bar edge to edge at the very bottom
     (the footer sizes itself to the bottom safe area). The safe-area padding goes on the content instead of the
     whole page, so the footer isn't inset on iOS.

     Why not position: fixed or 100dvh (both left a white bar under the footer on iOS):
     - iOS clamps fixed-position elements to the 'safe' visible viewport and doesn't paint them under the home
       indicator / toolbar. That strip is filled with the root (html/body) background instead, which is white.
     - 100dvh is the small viewport, which also stops above that strip.
     - 100vh is the large viewport, which runs to the physical bottom of the screen. translateZ(0) puts the frame
       on its own GPU layer of exactly that size, the same as the circle page, so iOS composites the whole frame,
       footer included, edge to edge under the home indicator.
     Scrolling stays inside the library sections (overflow hidden here, and no scroll chaining from them), so the
     taller 100vh frame doesn't make the page itself scroll in Safari. */
  height: 100vh;
  width: 100vw;
  transform: translateZ(0);
  overflow: hidden;
  overscroll-behavior: none;
  display: flex;
  flex-direction: column;
  touch-action: none;
}
.background > .main-body[data-v-12287a21] {
  padding-top: var(--safe-area-top);
  padding-left: var(--safe-area-left);
  padding-right: var(--safe-area-right);
}
.main-body[data-v-12287a21] {
  flex: 1;
  height: 0;
  display: flex;
  flex-direction: row;
}
.lib-header[data-v-12287a21]{
    width: 4rem;
    background-color: var(--background-color-secondary);
    display: flex;
    flex-direction: column;
    padding: 0.5rem;
}
.lib-header-icon[data-v-12287a21] {
  background-repeat: no-repeat;
  background-size: contain;
  background-position: left;
  aspect-ratio: 1;
  background-color: var(--background-color);
  border-radius: 0.5rem;
  padding: 0.25rem;
  border: solid 0.25rem var(--background-color);
  cursor: pointer;
  user-select: none;
}
.lib-header-text[data-v-12287a21]{
    
    flex: 1;
    display: flex;
    flex-direction: column;
    
    font-size: 1.25rem;
    text-align: center;
    justify-content: start;
    font-size: 0.8rem;
}
.lib-header-login[data-v-12287a21] {

  display: flex;
  flex-direction: column;
  justify-content: end;
  align-items: center;
  gap: 0.75rem;
  text-align: left;
}

/* round TV button: above the user icon on desktop, to its left on phones */
.lib-header-tv[data-v-12287a21] {
  width: 2.6rem;
  height: 2.6rem;
  min-width: 2.6rem;
  min-height: 2.6rem;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
  box-shadow: 0 2px 10px -3px var(--shadow);
  cursor: pointer;
  user-select: none;
  transition: transform ease-in-out 0.2s;
}
.lib-header-tv[data-v-12287a21]:hover {
    transform: scale(1.08);
}
.lib-header-login-button[data-v-12287a21] {
    margin-left: auto;
    margin-top: auto;
    margin-bottom: auto;
    user-select: none;
}
.lib-header-user-icon[data-v-12287a21] {
  width: 3rem;
  height: 3rem;
  min-width: 3rem;
  min-height: 3rem;
  margin: auto;

  border-radius: 100%;
  background-position: center;
  background-size: cover;
  background-color: var(--background-color);
  filter: drop-shadow(var(--shadow) 0rem 0rem 0.2rem);
}
.lib-body[data-v-12287a21] {
  width: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1rem;
  overflow: auto;
  overscroll-behavior: contain; /* scrolling the sections never drags the page itself */
}
.lib-body-section[data-v-12287a21] {
  position: relative;
  height: 0;
  flex: 1;
  border-radius: 1.2rem;
 
  box-shadow: 0 6px 32px var(--background-color-secondary);
}
.lib-body-section[data-v-12287a21]:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0%;
    width: 100%;
    height: 100%;
    opacity: 0.1;
    background: radial-gradient( circle at 49% 51%, /* Bottom left corner */
    var(--background-color) 00%, /* Accent color is very concentrated */
    var(--accent-color-secondary) 100% /* Fade starts early, covers a large area */
    );
    border-radius: 1.2rem;
    pointer-events: none;
}
@media screen and (max-width: 1000px) {
.main-body[data-v-12287a21]{
        flex-direction: column;
}
.lib-body[data-v-12287a21]{
        width: unset;
        height: 0;
}
.lib-header[data-v-12287a21]{
        width: unset;
        height: 4rem;
        flex-direction: row;
}
.lib-header-login[data-v-12287a21] {
        flex-direction: row;
}
}
@media screen and (max-width: 1000px) and (orientation: landscape) {
.lib-body[data-v-12287a21]{
      flex-direction: row;
}
.lib-body-section[data-v-12287a21]{
      width: 0;
      height: unset;
}
}


.library-card:before {
  content: '';
  position: absolute;
  top: 0;
  left: 66%;
  width: 12%;
  height: 100%;
  background: linear-gradient( 120deg, rgba(255,255,255,0.7) 0%, rgba(255,255,255,0.1) 100% );
  transform: skewX(-20deg);
  opacity: 0.4;
  pointer-events: none;
  filter: blur(1px);
  z-index: 5;
}

/* the white flare stands out more on dark cards- tone it down a little (class set by theme.js) */
.ct-dark-mode .library-card:before {
  opacity: 0.1;
}
.library-card {
  display: flex;
  flex-direction: column;
  text-align: center;
  margin-top: auto;
  margin-bottom: auto;
  border-radius: 1rem;
  overflow: hidden;
  flex-shrink: 0;
  cursor: pointer;
  user-select: none;
  transition: all ease-in-out 0.5s;
  position: relative;
  background: rgba(255, 255, 255, 0.15);
  background: var(--background-color-secondary);
  background: color-mix(in srgb, var(--background-color-secondary) 30%, transparent 70%);
  box-shadow: 0 5px 60px -20px var(--shadow);
  box-shadow: 0 5px 60px -20px color-mix(in srgb, var(--accent-color) 70%, #99999900 30%);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.25);
  overflow: hidden;
  border-top: solid 1px var(--background-color);
  border-bottom: solid 1px var(--background-color-secondary);
}
.library-card:hover {
    transform: scale(1.05);
}
.library-card-image {
  height: 0;
  flex: 5;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  display: flex;
  flex-direction: column;
}
.library-card-text {
  font-weight: bold;
  font-size: min(2rem, 2.5dvh);
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 0;
  flex: 4;
  padding-left: min(0.75rem, 1dvh);
  padding-right: min(0.75rem, 1dvh);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  -webkit-box-align: center;
}
@media screen and (max-width: 1000px) {
.library-card-text {
    
    font-size: 2vh;
}
}


.container-fluid{
    overflow: hidden;
    overscroll-behavior: none;
}


/*!
 * Quill Editor v1.3.7
 * https://quilljs.com/
 * Copyright (c) 2014, Jason Chen
 * Copyright (c) 2013, salesforce.com
 */
.ql-container {
  box-sizing: border-box;
  font-family: Helvetica, Arial, sans-serif;
  font-size: 13px;
  height: 100%;
  margin: 0px;
  position: relative;
}
.ql-container.ql-disabled .ql-tooltip {
  visibility: hidden;
}
.ql-container.ql-disabled .ql-editor ul[data-checked] > li::before {
  pointer-events: none;
}
.ql-clipboard {
  left: -100000px;
  height: 1px;
  overflow-y: hidden;
  position: absolute;
  top: 50%;
}
.ql-clipboard p {
  margin: 0;
  padding: 0;
}
.ql-editor {
  box-sizing: border-box;
  line-height: 1.42;
  height: 100%;
  outline: none;
  overflow-y: auto;
  padding: 12px 15px;
  tab-size: 4;
  -moz-tab-size: 4;
  text-align: left;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.ql-editor > * {
  cursor: text;
}
.ql-editor p,
.ql-editor ol,
.ql-editor ul,
.ql-editor pre,
.ql-editor blockquote,
.ql-editor h1,
.ql-editor h2,
.ql-editor h3,
.ql-editor h4,
.ql-editor h5,
.ql-editor h6 {
  margin: 0;
  padding: 0;
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol,
.ql-editor ul {
  padding-left: 1.5em;
}
.ql-editor ol > li,
.ql-editor ul > li {
  list-style-type: none;
}
.ql-editor ul > li::before {
  content: '\2022';
}
.ql-editor ul[data-checked=true],
.ql-editor ul[data-checked=false] {
  pointer-events: none;
}
.ql-editor ul[data-checked=true] > li *,
.ql-editor ul[data-checked=false] > li * {
  pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before,
.ql-editor ul[data-checked=false] > li::before {
  color: #777;
  cursor: pointer;
  pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before {
  content: '\2611';
}
.ql-editor ul[data-checked=false] > li::before {
  content: '\2610';
}
.ql-editor li::before {
  display: inline-block;
  white-space: nowrap;
  width: 1.2em;
}
.ql-editor li:not(.ql-direction-rtl)::before {
  margin-left: -1.5em;
  margin-right: 0.3em;
  text-align: right;
}
.ql-editor li.ql-direction-rtl::before {
  margin-left: 0.3em;
  margin-right: -1.5em;
}
.ql-editor ol li:not(.ql-direction-rtl),
.ql-editor ul li:not(.ql-direction-rtl) {
  padding-left: 1.5em;
}
.ql-editor ol li.ql-direction-rtl,
.ql-editor ul li.ql-direction-rtl {
  padding-right: 1.5em;
}
.ql-editor ol li {
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
  counter-increment: list-0;
}
.ql-editor ol li:before {
  content: counter(list-0, decimal) '. ';
}
.ql-editor ol li.ql-indent-1 {
  counter-increment: list-1;
}
.ql-editor ol li.ql-indent-1:before {
  content: counter(list-1, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-1 {
  counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-2 {
  counter-increment: list-2;
}
.ql-editor ol li.ql-indent-2:before {
  content: counter(list-2, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-2 {
  counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-3 {
  counter-increment: list-3;
}
.ql-editor ol li.ql-indent-3:before {
  content: counter(list-3, decimal) '. ';
}
.ql-editor ol li.ql-indent-3 {
  counter-reset: list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-4 {
  counter-increment: list-4;
}
.ql-editor ol li.ql-indent-4:before {
  content: counter(list-4, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-4 {
  counter-reset: list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-5 {
  counter-increment: list-5;
}
.ql-editor ol li.ql-indent-5:before {
  content: counter(list-5, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-5 {
  counter-reset: list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-6 {
  counter-increment: list-6;
}
.ql-editor ol li.ql-indent-6:before {
  content: counter(list-6, decimal) '. ';
}
.ql-editor ol li.ql-indent-6 {
  counter-reset: list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-7 {
  counter-increment: list-7;
}
.ql-editor ol li.ql-indent-7:before {
  content: counter(list-7, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-7 {
  counter-reset: list-8 list-9;
}
.ql-editor ol li.ql-indent-8 {
  counter-increment: list-8;
}
.ql-editor ol li.ql-indent-8:before {
  content: counter(list-8, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-8 {
  counter-reset: list-9;
}
.ql-editor ol li.ql-indent-9 {
  counter-increment: list-9;
}
.ql-editor ol li.ql-indent-9:before {
  content: counter(list-9, decimal) '. ';
}
.ql-editor .ql-indent-1:not(.ql-direction-rtl) {
  padding-left: 3em;
}
.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
  padding-left: 4.5em;
}
.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
  padding-right: 3em;
}
.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
  padding-right: 4.5em;
}
.ql-editor .ql-indent-2:not(.ql-direction-rtl) {
  padding-left: 6em;
}
.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
  padding-left: 7.5em;
}
.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
  padding-right: 6em;
}
.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
  padding-right: 7.5em;
}
.ql-editor .ql-indent-3:not(.ql-direction-rtl) {
  padding-left: 9em;
}
.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
  padding-left: 10.5em;
}
.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
  padding-right: 9em;
}
.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
  padding-right: 10.5em;
}
.ql-editor .ql-indent-4:not(.ql-direction-rtl) {
  padding-left: 12em;
}
.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
  padding-left: 13.5em;
}
.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
  padding-right: 12em;
}
.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
  padding-right: 13.5em;
}
.ql-editor .ql-indent-5:not(.ql-direction-rtl) {
  padding-left: 15em;
}
.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
  padding-left: 16.5em;
}
.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
  padding-right: 15em;
}
.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
  padding-right: 16.5em;
}
.ql-editor .ql-indent-6:not(.ql-direction-rtl) {
  padding-left: 18em;
}
.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
  padding-left: 19.5em;
}
.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
  padding-right: 18em;
}
.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
  padding-right: 19.5em;
}
.ql-editor .ql-indent-7:not(.ql-direction-rtl) {
  padding-left: 21em;
}
.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
  padding-left: 22.5em;
}
.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
  padding-right: 21em;
}
.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
  padding-right: 22.5em;
}
.ql-editor .ql-indent-8:not(.ql-direction-rtl) {
  padding-left: 24em;
}
.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
  padding-left: 25.5em;
}
.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
  padding-right: 24em;
}
.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
  padding-right: 25.5em;
}
.ql-editor .ql-indent-9:not(.ql-direction-rtl) {
  padding-left: 27em;
}
.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
  padding-left: 28.5em;
}
.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
  padding-right: 27em;
}
.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
  padding-right: 28.5em;
}
.ql-editor .ql-video {
  display: block;
  max-width: 100%;
}
.ql-editor .ql-video.ql-align-center {
  margin: 0 auto;
}
.ql-editor .ql-video.ql-align-right {
  margin: 0 0 0 auto;
}
.ql-editor .ql-bg-black {
  background-color: #000;
}
.ql-editor .ql-bg-red {
  background-color: #e60000;
}
.ql-editor .ql-bg-orange {
  background-color: #f90;
}
.ql-editor .ql-bg-yellow {
  background-color: #ff0;
}
.ql-editor .ql-bg-green {
  background-color: #008a00;
}
.ql-editor .ql-bg-blue {
  background-color: #06c;
}
.ql-editor .ql-bg-purple {
  background-color: #93f;
}
.ql-editor .ql-color-white {
  color: #fff;
}
.ql-editor .ql-color-red {
  color: #e60000;
}
.ql-editor .ql-color-orange {
  color: #f90;
}
.ql-editor .ql-color-yellow {
  color: #ff0;
}
.ql-editor .ql-color-green {
  color: #008a00;
}
.ql-editor .ql-color-blue {
  color: #06c;
}
.ql-editor .ql-color-purple {
  color: #93f;
}
.ql-editor .ql-font-serif {
  font-family: Georgia, Times New Roman, serif;
}
.ql-editor .ql-font-monospace {
  font-family: Monaco, Courier New, monospace;
}
.ql-editor .ql-size-small {
  font-size: 0.75em;
}
.ql-editor .ql-size-large {
  font-size: 1.5em;
}
.ql-editor .ql-size-huge {
  font-size: 2.5em;
}
.ql-editor .ql-direction-rtl {
  direction: rtl;
  text-align: inherit;
}
.ql-editor .ql-align-center {
  text-align: center;
}
.ql-editor .ql-align-justify {
  text-align: justify;
}
.ql-editor .ql-align-right {
  text-align: right;
}
.ql-editor.ql-blank::before {
  color: rgba(0,0,0,0.6);
  content: attr(data-placeholder);
  font-style: italic;
  left: 15px;
  pointer-events: none;
  position: absolute;
  right: 15px;
}
.ql-snow.ql-toolbar:after,
.ql-snow .ql-toolbar:after {
  clear: both;
  content: '';
  display: table;
}
.ql-snow.ql-toolbar button,
.ql-snow .ql-toolbar button {
  background: none;
  border: none;
  cursor: pointer;
  display: inline-block;
  float: left;
  height: 24px;
  padding: 3px 5px;
  width: 28px;
}
.ql-snow.ql-toolbar button svg,
.ql-snow .ql-toolbar button svg {
  float: left;
  height: 100%;
}
.ql-snow.ql-toolbar button:active:hover,
.ql-snow .ql-toolbar button:active:hover {
  outline: none;
}
.ql-snow.ql-toolbar input.ql-image[type=file],
.ql-snow .ql-toolbar input.ql-image[type=file] {
  display: none;
}
.ql-snow.ql-toolbar button:hover,
.ql-snow .ql-toolbar button:hover,
.ql-snow.ql-toolbar button:focus,
.ql-snow .ql-toolbar button:focus,
.ql-snow.ql-toolbar button.ql-active,
.ql-snow .ql-toolbar button.ql-active,
.ql-snow.ql-toolbar .ql-picker-label:hover,
.ql-snow .ql-toolbar .ql-picker-label:hover,
.ql-snow.ql-toolbar .ql-picker-label.ql-active,
.ql-snow .ql-toolbar .ql-picker-label.ql-active,
.ql-snow.ql-toolbar .ql-picker-item:hover,
.ql-snow .ql-toolbar .ql-picker-item:hover,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected {
  color: #06c;
}
.ql-snow.ql-toolbar button:hover .ql-fill,
.ql-snow .ql-toolbar button:hover .ql-fill,
.ql-snow.ql-toolbar button:focus .ql-fill,
.ql-snow .ql-toolbar button:focus .ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill {
  fill: #06c;
}
.ql-snow.ql-toolbar button:hover .ql-stroke,
.ql-snow .ql-toolbar button:hover .ql-stroke,
.ql-snow.ql-toolbar button:focus .ql-stroke,
.ql-snow .ql-toolbar button:focus .ql-stroke,
.ql-snow.ql-toolbar button.ql-active .ql-stroke,
.ql-snow .ql-toolbar button.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow.ql-toolbar button:hover .ql-stroke-miter,
.ql-snow .ql-toolbar button:hover .ql-stroke-miter,
.ql-snow.ql-toolbar button:focus .ql-stroke-miter,
.ql-snow .ql-toolbar button:focus .ql-stroke-miter,
.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
  stroke: #06c;
}
@media (pointer: coarse) {
  .ql-snow.ql-toolbar button:hover:not(.ql-active),
  .ql-snow .ql-toolbar button:hover:not(.ql-active) {
    color: #444;
  }
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {
    fill: #444;
  }
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {
    stroke: #444;
  }
}
.ql-snow {
  box-sizing: border-box;
}
.ql-snow * {
  box-sizing: border-box;
}
.ql-snow .ql-hidden {
  display: none;
}
.ql-snow .ql-out-bottom,
.ql-snow .ql-out-top {
  visibility: hidden;
}
.ql-snow .ql-tooltip {
  position: absolute;
  transform: translateY(10px);
}
.ql-snow .ql-tooltip a {
  cursor: pointer;
  text-decoration: none;
}
.ql-snow .ql-tooltip.ql-flip {
  transform: translateY(-10px);
}
.ql-snow .ql-formats {
  display: inline-block;
  vertical-align: middle;
}
.ql-snow .ql-formats:after {
  clear: both;
  content: '';
  display: table;
}
.ql-snow .ql-stroke {
  fill: none;
  stroke: #444;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}
.ql-snow .ql-stroke-miter {
  fill: none;
  stroke: #444;
  stroke-miterlimit: 10;
  stroke-width: 2;
}
.ql-snow .ql-fill,
.ql-snow .ql-stroke.ql-fill {
  fill: #444;
}
.ql-snow .ql-empty {
  fill: none;
}
.ql-snow .ql-even {
  fill-rule: evenodd;
}
.ql-snow .ql-thin,
.ql-snow .ql-stroke.ql-thin {
  stroke-width: 1;
}
.ql-snow .ql-transparent {
  opacity: 0.4;
}
.ql-snow .ql-direction svg:last-child {
  display: none;
}
.ql-snow .ql-direction.ql-active svg:last-child {
  display: inline;
}
.ql-snow .ql-direction.ql-active svg:first-child {
  display: none;
}
.ql-snow .ql-editor h1 {
  font-size: 2em;
}
.ql-snow .ql-editor h2 {
  font-size: 1.5em;
}
.ql-snow .ql-editor h3 {
  font-size: 1.17em;
}
.ql-snow .ql-editor h4 {
  font-size: 1em;
}
.ql-snow .ql-editor h5 {
  font-size: 0.83em;
}
.ql-snow .ql-editor h6 {
  font-size: 0.67em;
}
.ql-snow .ql-editor a {
  text-decoration: underline;
}
.ql-snow .ql-editor blockquote {
  border-left: 4px solid #ccc;
  margin-bottom: 5px;
  margin-top: 5px;
  padding-left: 16px;
}
.ql-snow .ql-editor code,
.ql-snow .ql-editor pre {
  background-color: #f0f0f0;
  border-radius: 3px;
}
.ql-snow .ql-editor pre {
  white-space: pre-wrap;
  margin-bottom: 5px;
  margin-top: 5px;
  padding: 5px 10px;
}
.ql-snow .ql-editor code {
  font-size: 85%;
  padding: 2px 4px;
}
.ql-snow .ql-editor pre.ql-syntax {
  background-color: #23241f;
  color: #f8f8f2;
  overflow: visible;
}
.ql-snow .ql-editor img {
  max-width: 100%;
}
.ql-snow .ql-picker {
  color: #444;
  display: inline-block;
  float: left;
  font-size: 14px;
  font-weight: 500;
  height: 24px;
  position: relative;
  vertical-align: middle;
}
.ql-snow .ql-picker-label {
  cursor: pointer;
  display: inline-block;
  height: 100%;
  padding-left: 8px;
  padding-right: 2px;
  position: relative;
  width: 100%;
}
.ql-snow .ql-picker-label::before {
  display: inline-block;
  line-height: 22px;
}
.ql-snow .ql-picker-options {
  background-color: #fff;
  display: none;
  min-width: 100%;
  padding: 4px 8px;
  position: absolute;
  white-space: nowrap;
}
.ql-snow .ql-picker-options .ql-picker-item {
  cursor: pointer;
  display: block;
  padding-bottom: 5px;
  padding-top: 5px;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label {
  color: #ccc;
  z-index: 2;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill {
  fill: #ccc;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
  stroke: #ccc;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-options {
  display: block;
  margin-top: -1px;
  top: 100%;
  z-index: 1;
}
.ql-snow .ql-color-picker,
.ql-snow .ql-icon-picker {
  width: 28px;
}
.ql-snow .ql-color-picker .ql-picker-label,
.ql-snow .ql-icon-picker .ql-picker-label {
  padding: 2px 4px;
}
.ql-snow .ql-color-picker .ql-picker-label svg,
.ql-snow .ql-icon-picker .ql-picker-label svg {
  right: 4px;
}
.ql-snow .ql-icon-picker .ql-picker-options {
  padding: 4px 0px;
}
.ql-snow .ql-icon-picker .ql-picker-item {
  height: 24px;
  width: 24px;
  padding: 2px 4px;
}
.ql-snow .ql-color-picker .ql-picker-options {
  padding: 3px 5px;
  width: 152px;
}
.ql-snow .ql-color-picker .ql-picker-item {
  border: 1px solid transparent;
  float: left;
  height: 16px;
  margin: 2px;
  padding: 0px;
  width: 16px;
}
.ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg {
  position: absolute;
  margin-top: -9px;
  right: 0;
  top: 50%;
  width: 18px;
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=''])::before {
  content: attr(data-label);
}
.ql-snow .ql-picker.ql-header {
  width: 98px;
}
.ql-snow .ql-picker.ql-header .ql-picker-label::before,
.ql-snow .ql-picker.ql-header .ql-picker-item::before {
  content: 'Normal';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
  content: 'Heading 1';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
  content: 'Heading 2';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
  content: 'Heading 3';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
  content: 'Heading 4';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
  content: 'Heading 5';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
  content: 'Heading 6';
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
  font-size: 2em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
  font-size: 1.5em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
  font-size: 1.17em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
  font-size: 1em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
  font-size: 0.83em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
  font-size: 0.67em;
}
.ql-snow .ql-picker.ql-font {
  width: 108px;
}
.ql-snow .ql-picker.ql-font .ql-picker-label::before,
.ql-snow .ql-picker.ql-font .ql-picker-item::before {
  content: 'Sans Serif';
}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {
  content: 'Serif';
}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {
  content: 'Monospace';
}
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {
  font-family: Georgia, Times New Roman, serif;
}
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {
  font-family: Monaco, Courier New, monospace;
}
.ql-snow .ql-picker.ql-size {
  width: 98px;
}
.ql-snow .ql-picker.ql-size .ql-picker-label::before,
.ql-snow .ql-picker.ql-size .ql-picker-item::before {
  content: 'Normal';
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before {
  content: 'Small';
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before {
  content: 'Large';
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {
  content: 'Huge';
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before {
  font-size: 10px;
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before {
  font-size: 18px;
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {
  font-size: 32px;
}
.ql-snow .ql-color-picker.ql-background .ql-picker-item {
  background-color: #fff;
}
.ql-snow .ql-color-picker.ql-color .ql-picker-item {
  background-color: #000;
}
.ql-toolbar.ql-snow {
  border: 1px solid #ccc;
  box-sizing: border-box;
  font-family: 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
  padding: 8px;
}
.ql-toolbar.ql-snow .ql-formats {
  margin-right: 15px;
}
.ql-toolbar.ql-snow .ql-picker-label {
  border: 1px solid transparent;
}
.ql-toolbar.ql-snow .ql-picker-options {
  border: 1px solid transparent;
  box-shadow: rgba(0,0,0,0.2) 0 2px 8px;
}
.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label {
  border-color: #ccc;
}
.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
  border-color: #ccc;
}
.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,
.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover {
  border-color: #000;
}
.ql-toolbar.ql-snow + .ql-container.ql-snow {
  border-top: 0px;
}
.ql-snow .ql-tooltip {
  background-color: #fff;
  border: 1px solid #ccc;
  box-shadow: 0px 0px 5px #ddd;
  color: #444;
  padding: 5px 12px;
  white-space: nowrap;
}
.ql-snow .ql-tooltip::before {
  content: "Visit URL:";
  line-height: 26px;
  margin-right: 8px;
}
.ql-snow .ql-tooltip input[type=text] {
  display: none;
  border: 1px solid #ccc;
  font-size: 13px;
  height: 26px;
  margin: 0px;
  padding: 3px 5px;
  width: 170px;
}
.ql-snow .ql-tooltip a.ql-preview {
  display: inline-block;
  max-width: 200px;
  overflow-x: hidden;
  text-overflow: ellipsis;
  vertical-align: top;
}
.ql-snow .ql-tooltip a.ql-action::after {
  border-right: 1px solid #ccc;
  content: 'Edit';
  margin-left: 16px;
  padding-right: 8px;
}
.ql-snow .ql-tooltip a.ql-remove::before {
  content: 'Remove';
  margin-left: 8px;
}
.ql-snow .ql-tooltip a {
  line-height: 26px;
}
.ql-snow .ql-tooltip.ql-editing a.ql-preview,
.ql-snow .ql-tooltip.ql-editing a.ql-remove {
  display: none;
}
.ql-snow .ql-tooltip.ql-editing input[type=text] {
  display: inline-block;
}
.ql-snow .ql-tooltip.ql-editing a.ql-action::after {
  border-right: 0px;
  content: 'Save';
  padding-right: 0px;
}
.ql-snow .ql-tooltip[data-mode=link]::before {
  content: "Enter link:";
}
.ql-snow .ql-tooltip[data-mode=formula]::before {
  content: "Enter formula:";
}
.ql-snow .ql-tooltip[data-mode=video]::before {
  content: "Enter video:";
}
.ql-snow a {
  color: #06c;
}
.ql-container.ql-snow {
  border: 1px solid #ccc;
}


.ql-toolbar {
  border-color: var(--foreground-color) !important;
  border-top-left-radius: 0.3rem;
  border-top-right-radius: 0.3rem;
}
.ql-stroke {
  stroke: var(--foreground-color) !important;
}
.ql-fill {
  fill: var(--foreground-color) !important;
}
.ql-picker-label {
  color: var(--foreground-color) !important;
}
.ql-document {
  background-image: url(https://cdn.faithchapel.cc/images/shared/file-alt-solid.svg) !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
  background-position: center !important;
  height: 1rem !important;
  padding: 0.5rem !important;
  margin-top: 0.25rem !important;
}
.top-bar-label {
  padding-bottom: 0.3rem;
  color: var(--light-foreground-color);
  font-size: 0.8rem;
}
.ql-syntax{
    background-color: unset !important;
    color: unset !important;
    border: solid 1px var(--accent-color);
    font-family: unset;
    padding: 2rem !important;
    border-radius: 0.8rem !important;
    text-wrap: auto;
}
.quill-hr hr {
  border: 0 !important;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--accent-color), transparent);
}



.email-editor[data-v-77d576c6] {
  display: flex;
  flex-direction: row;
  padding: 0 0.75rem;
  margin-left: auto;
  margin-right: auto;
}
.ql-container[data-v-77d576c6] {
  flex: 1;
  height: 0;
  border-color: var(--foreground-color) !important;
  border-bottom-left-radius: 0.3rem;
  border-bottom-right-radius: 0.3rem;
}



.flatpickr-calendar {
  background: transparent;
  opacity: 0;
  display: none;
  text-align: center;
  visibility: hidden;
  padding: 0;
  -webkit-animation: none;
          animation: none;
  direction: ltr;
  border: 0;
  font-size: 14px;
  line-height: 24px;
  border-radius: 5px;
  position: absolute;
  width: 307.875px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
  background: #fff;
  -webkit-box-shadow: 1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0,0,0,0.08);
          box-shadow: 1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0,0,0,0.08);
}
.flatpickr-calendar.open,
.flatpickr-calendar.inline {
  opacity: 1;
  max-height: 640px;
  visibility: visible;
}
.flatpickr-calendar.open {
  display: inline-block;
  z-index: 99999;
}
.flatpickr-calendar.animate.open {
  -webkit-animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);
          animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);
}
.flatpickr-calendar.inline {
  display: block;
  position: relative;
  top: 2px;
}
.flatpickr-calendar.static {
  position: absolute;
  top: calc(100% + 2px);
}
.flatpickr-calendar.static.open {
  z-index: 999;
  display: block;
}
.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7) {
  -webkit-box-shadow: none !important;
          box-shadow: none !important;
}
.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1) {
  -webkit-box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
          box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
}
.flatpickr-calendar .hasWeeks .dayContainer,
.flatpickr-calendar .hasTime .dayContainer {
  border-bottom: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.flatpickr-calendar .hasWeeks .dayContainer {
  border-left: 0;
}
.flatpickr-calendar.hasTime .flatpickr-time {
  height: 40px;
  border-top: 1px solid #e6e6e6;
}
.flatpickr-calendar.noCalendar.hasTime .flatpickr-time {
  height: auto;
}
.flatpickr-calendar:before,
.flatpickr-calendar:after {
  position: absolute;
  display: block;
  pointer-events: none;
  border: solid transparent;
  content: '';
  height: 0;
  width: 0;
  left: 22px;
}
.flatpickr-calendar.rightMost:before,
.flatpickr-calendar.arrowRight:before,
.flatpickr-calendar.rightMost:after,
.flatpickr-calendar.arrowRight:after {
  left: auto;
  right: 22px;
}
.flatpickr-calendar.arrowCenter:before,
.flatpickr-calendar.arrowCenter:after {
  left: 50%;
  right: 50%;
}
.flatpickr-calendar:before {
  border-width: 5px;
  margin: 0 -5px;
}
.flatpickr-calendar:after {
  border-width: 4px;
  margin: 0 -4px;
}
.flatpickr-calendar.arrowTop:before,
.flatpickr-calendar.arrowTop:after {
  bottom: 100%;
}
.flatpickr-calendar.arrowTop:before {
  border-bottom-color: #e6e6e6;
}
.flatpickr-calendar.arrowTop:after {
  border-bottom-color: #fff;
}
.flatpickr-calendar.arrowBottom:before,
.flatpickr-calendar.arrowBottom:after {
  top: 100%;
}
.flatpickr-calendar.arrowBottom:before {
  border-top-color: #e6e6e6;
}
.flatpickr-calendar.arrowBottom:after {
  border-top-color: #fff;
}
.flatpickr-calendar:focus {
  outline: 0;
}
.flatpickr-wrapper {
  position: relative;
  display: inline-block;
}
.flatpickr-months {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.flatpickr-months .flatpickr-month {
  background: transparent;
  color: rgba(0,0,0,0.9);
  fill: rgba(0,0,0,0.9);
  height: 34px;
  line-height: 1;
  text-align: center;
  position: relative;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  overflow: hidden;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  text-decoration: none;
  cursor: pointer;
  position: absolute;
  top: 0;
  height: 34px;
  padding: 10px;
  z-index: 3;
  color: rgba(0,0,0,0.9);
  fill: rgba(0,0,0,0.9);
}
.flatpickr-months .flatpickr-prev-month.flatpickr-disabled,
.flatpickr-months .flatpickr-next-month.flatpickr-disabled {
  display: none;
}
.flatpickr-months .flatpickr-prev-month i,
.flatpickr-months .flatpickr-next-month i {
  position: relative;
}
.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month.flatpickr-prev-month {
/*
      /*rtl:begin:ignore*/
/*
      */
  left: 0;
/*
      /*rtl:end:ignore*/
/*
      */
}
/*
      /*rtl:begin:ignore*/
/*
      /*rtl:end:ignore*/
.flatpickr-months .flatpickr-prev-month.flatpickr-next-month,
.flatpickr-months .flatpickr-next-month.flatpickr-next-month {
/*
      /*rtl:begin:ignore*/
/*
      */
  right: 0;
/*
      /*rtl:end:ignore*/
/*
      */
}
/*
      /*rtl:begin:ignore*/
/*
      /*rtl:end:ignore*/
.flatpickr-months .flatpickr-prev-month:hover,
.flatpickr-months .flatpickr-next-month:hover {
  color: #959ea9;
}
.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg {
  fill: #f64747;
}
.flatpickr-months .flatpickr-prev-month svg,
.flatpickr-months .flatpickr-next-month svg {
  width: 14px;
  height: 14px;
}
.flatpickr-months .flatpickr-prev-month svg path,
.flatpickr-months .flatpickr-next-month svg path {
  -webkit-transition: fill 0.1s;
  transition: fill 0.1s;
  fill: inherit;
}
.numInputWrapper {
  position: relative;
  height: auto;
}
.numInputWrapper input,
.numInputWrapper span {
  display: inline-block;
}
.numInputWrapper input {
  width: 100%;
}
.numInputWrapper input::-ms-clear {
  display: none;
}
.numInputWrapper input::-webkit-outer-spin-button,
.numInputWrapper input::-webkit-inner-spin-button {
  margin: 0;
  -webkit-appearance: none;
}
.numInputWrapper span {
  position: absolute;
  right: 0;
  width: 14px;
  padding: 0 4px 0 2px;
  height: 50%;
  line-height: 50%;
  opacity: 0;
  cursor: pointer;
  border: 1px solid rgba(57,57,57,0.15);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.numInputWrapper span:hover {
  background: rgba(0,0,0,0.1);
}
.numInputWrapper span:active {
  background: rgba(0,0,0,0.2);
}
.numInputWrapper span:after {
  display: block;
  content: "";
  position: absolute;
}
.numInputWrapper span.arrowUp {
  top: 0;
  border-bottom: 0;
}
.numInputWrapper span.arrowUp:after {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: 4px solid rgba(57,57,57,0.6);
  top: 26%;
}
.numInputWrapper span.arrowDown {
  top: 50%;
}
.numInputWrapper span.arrowDown:after {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid rgba(57,57,57,0.6);
  top: 40%;
}
.numInputWrapper span svg {
  width: inherit;
  height: auto;
}
.numInputWrapper span svg path {
  fill: rgba(0,0,0,0.5);
}
.numInputWrapper:hover {
  background: rgba(0,0,0,0.05);
}
.numInputWrapper:hover span {
  opacity: 1;
}
.flatpickr-current-month {
  font-size: 135%;
  line-height: inherit;
  font-weight: 300;
  color: inherit;
  position: absolute;
  width: 75%;
  left: 12.5%;
  padding: 7.48px 0 0 0;
  line-height: 1;
  height: 34px;
  display: inline-block;
  text-align: center;
  -webkit-transform: translate3d(0px, 0px, 0px);
          transform: translate3d(0px, 0px, 0px);
}
.flatpickr-current-month span.cur-month {
  font-family: inherit;
  font-weight: 700;
  color: inherit;
  display: inline-block;
  margin-left: 0.5ch;
  padding: 0;
}
.flatpickr-current-month span.cur-month:hover {
  background: rgba(0,0,0,0.05);
}
.flatpickr-current-month .numInputWrapper {
  width: 6ch;
  width: 7ch\0;
  display: inline-block;
}
.flatpickr-current-month .numInputWrapper span.arrowUp:after {
  border-bottom-color: rgba(0,0,0,0.9);
}
.flatpickr-current-month .numInputWrapper span.arrowDown:after {
  border-top-color: rgba(0,0,0,0.9);
}
.flatpickr-current-month input.cur-year {
  background: transparent;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  color: inherit;
  cursor: text;
  padding: 0 0 0 0.5ch;
  margin: 0;
  display: inline-block;
  font-size: inherit;
  font-family: inherit;
  font-weight: 300;
  line-height: inherit;
  height: auto;
  border: 0;
  border-radius: 0;
  vertical-align: initial;
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}
.flatpickr-current-month input.cur-year:focus {
  outline: 0;
}
.flatpickr-current-month input.cur-year[disabled],
.flatpickr-current-month input.cur-year[disabled]:hover {
  font-size: 100%;
  color: rgba(0,0,0,0.5);
  background: transparent;
  pointer-events: none;
}
.flatpickr-current-month .flatpickr-monthDropdown-months {
  appearance: menulist;
  background: transparent;
  border: none;
  border-radius: 0;
  box-sizing: border-box;
  color: inherit;
  cursor: pointer;
  font-size: inherit;
  font-family: inherit;
  font-weight: 300;
  height: auto;
  line-height: inherit;
  margin: -1px 0 0 0;
  outline: none;
  padding: 0 0 0 0.5ch;
  position: relative;
  vertical-align: initial;
  -webkit-box-sizing: border-box;
  -webkit-appearance: menulist;
  -moz-appearance: menulist;
  width: auto;
}
.flatpickr-current-month .flatpickr-monthDropdown-months:focus,
.flatpickr-current-month .flatpickr-monthDropdown-months:active {
  outline: none;
}
.flatpickr-current-month .flatpickr-monthDropdown-months:hover {
  background: rgba(0,0,0,0.05);
}
.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {
  background-color: transparent;
  outline: none;
  padding: 0;
}
.flatpickr-weekdays {
  background: transparent;
  text-align: center;
  overflow: hidden;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  height: 28px;
}
.flatpickr-weekdays .flatpickr-weekdaycontainer {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
span.flatpickr-weekday {
  cursor: default;
  font-size: 90%;
  background: transparent;
  color: rgba(0,0,0,0.54);
  line-height: 1;
  margin: 0;
  text-align: center;
  display: block;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-weight: bolder;
}
.dayContainer,
.flatpickr-weeks {
  padding: 1px 0 0 0;
}
.flatpickr-days {
  position: relative;
  overflow: hidden;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 307.875px;
}
.flatpickr-days:focus {
  outline: 0;
}
.dayContainer {
  padding: 0;
  outline: 0;
  text-align: left;
  width: 307.875px;
  min-width: 307.875px;
  max-width: 307.875px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: inline-block;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
          flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-around;
          justify-content: space-around;
  -webkit-transform: translate3d(0px, 0px, 0px);
          transform: translate3d(0px, 0px, 0px);
  opacity: 1;
}
.dayContainer + .dayContainer {
  -webkit-box-shadow: -1px 0 0 #e6e6e6;
          box-shadow: -1px 0 0 #e6e6e6;
}
.flatpickr-day {
  background: none;
  border: 1px solid transparent;
  border-radius: 150px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  color: #393939;
  cursor: pointer;
  font-weight: 400;
  width: 14.2857143%;
  -webkit-flex-basis: 14.2857143%;
      -ms-flex-preferred-size: 14.2857143%;
          flex-basis: 14.2857143%;
  max-width: 39px;
  height: 39px;
  line-height: 39px;
  margin: 0;
  display: inline-block;
  position: relative;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-align: center;
}
.flatpickr-day.inRange,
.flatpickr-day.prevMonthDay.inRange,
.flatpickr-day.nextMonthDay.inRange,
.flatpickr-day.today.inRange,
.flatpickr-day.prevMonthDay.today.inRange,
.flatpickr-day.nextMonthDay.today.inRange,
.flatpickr-day:hover,
.flatpickr-day.prevMonthDay:hover,
.flatpickr-day.nextMonthDay:hover,
.flatpickr-day:focus,
.flatpickr-day.prevMonthDay:focus,
.flatpickr-day.nextMonthDay:focus {
  cursor: pointer;
  outline: 0;
  background: #e6e6e6;
  border-color: #e6e6e6;
}
.flatpickr-day.today {
  border-color: #959ea9;
}
.flatpickr-day.today:hover,
.flatpickr-day.today:focus {
  border-color: #959ea9;
  background: #959ea9;
  color: #fff;
}
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.startRange.inRange,
.flatpickr-day.endRange.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange:focus,
.flatpickr-day.endRange:focus,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover,
.flatpickr-day.selected.prevMonthDay,
.flatpickr-day.startRange.prevMonthDay,
.flatpickr-day.endRange.prevMonthDay,
.flatpickr-day.selected.nextMonthDay,
.flatpickr-day.startRange.nextMonthDay,
.flatpickr-day.endRange.nextMonthDay {
  background: #569ff7;
  -webkit-box-shadow: none;
          box-shadow: none;
  color: #fff;
  border-color: #569ff7;
}
.flatpickr-day.selected.startRange,
.flatpickr-day.startRange.startRange,
.flatpickr-day.endRange.startRange {
  border-radius: 50px 0 0 50px;
}
.flatpickr-day.selected.endRange,
.flatpickr-day.startRange.endRange,
.flatpickr-day.endRange.endRange {
  border-radius: 0 50px 50px 0;
}
.flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)),
.flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)),
.flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)) {
  -webkit-box-shadow: -10px 0 0 #569ff7;
          box-shadow: -10px 0 0 #569ff7;
}
.flatpickr-day.selected.startRange.endRange,
.flatpickr-day.startRange.startRange.endRange,
.flatpickr-day.endRange.startRange.endRange {
  border-radius: 50px;
}
.flatpickr-day.inRange {
  border-radius: 0;
  -webkit-box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
          box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
}
.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover,
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay,
.flatpickr-day.notAllowed,
.flatpickr-day.notAllowed.prevMonthDay,
.flatpickr-day.notAllowed.nextMonthDay {
  color: rgba(57,57,57,0.3);
  background: transparent;
  border-color: transparent;
  cursor: default;
}
.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover {
  cursor: not-allowed;
  color: rgba(57,57,57,0.1);
}
.flatpickr-day.week.selected {
  border-radius: 0;
  -webkit-box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;
          box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;
}
.flatpickr-day.hidden {
  visibility: hidden;
}
.rangeMode .flatpickr-day {
  margin-top: 1px;
}
.flatpickr-weekwrapper {
  float: left;
}
.flatpickr-weekwrapper .flatpickr-weeks {
  padding: 0 12px;
  -webkit-box-shadow: 1px 0 0 #e6e6e6;
          box-shadow: 1px 0 0 #e6e6e6;
}
.flatpickr-weekwrapper .flatpickr-weekday {
  float: none;
  width: 100%;
  line-height: 28px;
}
.flatpickr-weekwrapper span.flatpickr-day,
.flatpickr-weekwrapper span.flatpickr-day:hover {
  display: block;
  width: 100%;
  max-width: none;
  color: rgba(57,57,57,0.3);
  background: transparent;
  cursor: default;
  border: none;
}
.flatpickr-innerContainer {
  display: block;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  overflow: hidden;
}
.flatpickr-rContainer {
  display: inline-block;
  padding: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.flatpickr-time {
  text-align: center;
  outline: 0;
  display: block;
  height: 0;
  line-height: 40px;
  max-height: 40px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  overflow: hidden;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.flatpickr-time:after {
  content: "";
  display: table;
  clear: both;
}
.flatpickr-time .numInputWrapper {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
  width: 40%;
  height: 40px;
  float: left;
}
.flatpickr-time .numInputWrapper span.arrowUp:after {
  border-bottom-color: #393939;
}
.flatpickr-time .numInputWrapper span.arrowDown:after {
  border-top-color: #393939;
}
.flatpickr-time.hasSeconds .numInputWrapper {
  width: 26%;
}
.flatpickr-time.time24hr .numInputWrapper {
  width: 49%;
}
.flatpickr-time input {
  background: transparent;
  -webkit-box-shadow: none;
          box-shadow: none;
  border: 0;
  border-radius: 0;
  text-align: center;
  margin: 0;
  padding: 0;
  height: inherit;
  line-height: inherit;
  color: #393939;
  font-size: 14px;
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}
.flatpickr-time input.flatpickr-hour {
  font-weight: bold;
}
.flatpickr-time input.flatpickr-minute,
.flatpickr-time input.flatpickr-second {
  font-weight: 400;
}
.flatpickr-time input:focus {
  outline: 0;
  border: 0;
}
.flatpickr-time .flatpickr-time-separator,
.flatpickr-time .flatpickr-am-pm {
  height: inherit;
  float: left;
  line-height: inherit;
  color: #393939;
  font-weight: bold;
  width: 2%;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-align-self: center;
      -ms-flex-item-align: center;
          align-self: center;
}
.flatpickr-time .flatpickr-am-pm {
  outline: 0;
  width: 18%;
  cursor: pointer;
  text-align: center;
  font-weight: 400;
}
.flatpickr-time input:hover,
.flatpickr-time .flatpickr-am-pm:hover,
.flatpickr-time input:focus,
.flatpickr-time .flatpickr-am-pm:focus {
  background: #eee;
}
.flatpickr-input[readonly] {
  cursor: pointer;
}
@-webkit-keyframes fpFadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
@keyframes fpFadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}


.announcements-container[data-v-d7f66462] {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.announcements-header-container[data-v-d7f66462] {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}
.announcements-image[data-v-d7f66462] {
  height: 4rem;
  width: 4rem;
  border-radius: 50%;
  
  margin-bottom: 0.25rem;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;

  transition: ease-in-out all 0.3s;
  margin-left: 1rem;
}
.announcements-header[data-v-d7f66462] {
  font-size: 1.5rem;
  font-weight: bold;
  text-align: left;
  margin-top: auto;
  margin-bottom: auto;
  flex: 3;
}
.announcements-body[data-v-d7f66462] {
  height: 0;
  flex: 1;
  overflow: auto;
  gap: 1rem;
}

/* scheduled (future) announcements: visible to hosts/editors only, greyed out until they go live */
.announcement-scheduled .announcement-body[data-v-d7f66462],
.announcement-scheduled .announcement-footer[data-v-d7f66462] {
  opacity: 0.45;
  filter: grayscale(1);
}
.announcement-scheduled .announcement-body[data-v-d7f66462] {
  border-style: dashed;
  border-color: var(--foreground-color-secondary);
  box-shadow: none;
}
.announcement-scheduled-badge[data-v-d7f66462] {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem 0.5rem;
  margin: 1rem 1rem -0.5rem 1rem;
  font-size: 0.9rem;
  font-weight: bold;
  color: var(--accent-color);
}
.announcement-scheduled-note[data-v-d7f66462] {
  font-weight: normal;
  font-style: italic;
  opacity: 0.7;
  font-size: 0.8rem;
}
@media screen and (max-width: 1000px) {
.announcement-scheduled-badge[data-v-d7f66462] {
    margin: 0.5rem 0.5rem -0.25rem 0.5rem;
}
}
.quill-wrapper[data-v-d7f66462] {
  overflow: auto;
  display: flex;
  flex-direction: column;
}
.quill-input[data-v-d7f66462] {
  font-size: 1.1rem;
  font-weight: normal;
  width: 100%;
  border: solid 1px var(--foreground-color);
  border-bottom-left-radius: 0.4rem;
  border-bottom-right-radius: 0.4rem;
  padding: 0.5rem;
}
.modal-body[data-v-d7f66462] {
  width: calc(100% - 2rem);
  height: 0;
  flex: 1;
  overflow: auto;
  margin: 1rem 0;
  display: flex;
  flex-direction: column; /* no flex-wrap: with a fixed height, wrapping pushed the items into side-by-side columns */
  gap: 1rem;
  text-align: center;
  justify-content: flex-start;
  position: relative;
  padding: 1rem;
  box-sizing: border-box;
  width: 100%;
}
.modal-body > h3[data-v-d7f66462] {
  margin: 0;
}
.modal-body[data-v-d7f66462] {
  overflow-x: hidden;
}

/* .button-inverse is always scaled to 102% (site.scss), so a full-width button overflowed the window sideways */
.edit-ok-wrapper[data-v-d7f66462] {
  padding: 0.25rem 1rem 0.5rem 1rem;
  box-sizing: border-box;
  width: 100%;
}

/* the editor takes the remaining space; long content scrolls inside the editor instead of growing the modal */
.edit-quill-area[data-v-d7f66462] {
  flex: 1;
  height: 0;
  min-height: 12rem;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  text-align: left;
}
.announcement[data-v-d7f66462] {
}
.announcement-body[data-v-d7f66462] {
  font-size: 1.5rem;
  border: solid 1px var(--background-color-secondary);
  border-radius: 0.8rem;
  margin: 1rem;
  padding: 1rem;
  margin-bottom: 0.25rem;
  box-shadow: 0 5px 60px -20px var(--shadow);
  box-shadow: 0 5px 60px -20px color-mix(in srgb, var(--accent-color) 50%, #99999900 50%);
}
.announcement-moderation-buttons[data-v-d7f66462] {
  display: flex;
  gap: 0.25rem;
  overflow: hidden;
  max-width: 0;
  transition: ease-in-out all 0.5s;
}
.announcement-moderation-buttons .button[data-v-d7f66462] {
    margin-bottom: auto;
    margin-top: 1.5rem;
}
.announcement:hover .announcement-moderation-buttons[data-v-d7f66462]{
    max-width: 15rem;
}
.announcement-footer[data-v-d7f66462] {
  font-size: 0.9rem;
  padding-left: 1rem;
  padding-right: 1rem;
  font-style: italic;
  opacity: 0.5;
  display: flex;
  margin-bottom: 1rem;
}
.my-circle-image[data-v-d7f66462] {
  width: 3rem;
  height: 3rem;
  margin-top: auto;
  margin-bottom: auto;
  margin-left: auto;
  border-radius: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}
.edit-dates[data-v-d7f66462]{
    display: flex;
    flex-direction: row;
    gap: 1rem;
}
.edit-modal-date[data-v-d7f66462] {
  text-align: left;
  flex: 1;
}
.announcement-add-button[data-v-d7f66462] {
  width: 3rem;
  height: 3rem;
  border-radius: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  color: var(--accent-foreground-color);
  background-color: var(--accent-color);
  user-select: none;
  cursor: pointer;
  transition: all ease-in-out 0.25s;
}
.announcement-add-button[data-v-d7f66462]:hover {
    transform: scale(1.01);
}
@media screen and (max-width: 1000px) {
.announcements-header-container[data-v-d7f66462] {
    gap: 0.5rem;
}
.announcements-image[data-v-d7f66462] {
}
.announcements-header[data-v-d7f66462] {
    font-size: 1rem;
}
.announcement-body[data-v-d7f66462] {
    font-size: 1.2rem;
    margin: 0.5rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    margin-bottom: 0.2rem;
}
.announcement-footer[data-v-d7f66462] {
    margin-bottom: 0.5rem;
}
.edit-dates[data-v-d7f66462]{
      flex-direction: column;
}
.edit-modal-date[data-v-d7f66462]{
      flex: unset;
}
.quill-wrapper[data-v-d7f66462]{
      height: 100%;
}
}


.ql-editor{
    font-size: 1.4rem;
}
.edit-quill-area .ql-container {
  flex: 1;
  height: 0;
  min-height: 0;
}
.edit-quill-area .ql-editor {
  overflow-y: auto;
}
.announcements-body p {
  margin-block-start: 0;
  margin-block-end: 0;
}
.announcement-body a {
  color: var(--accent-color);
}
.announcement-body .button {
  text-decoration: none;
  color: var(--accent-foreground-color);
  background-color: var(--accent-color);
  text-align: center;
  font-weight: bold;
  margin: 1rem 0;
}
.announcement-body .button a {
    color: var(--background-color);
    text-decoration: none;
}


.track-item-editor[data-v-5f4932b2] {
  display: flex;
  flex-direction: column;
  height: 0;
  flex: 1;
}
.plain-text-input[data-v-5f4932b2] {
  font-size: 1.1rem;
  font-weight: normal;
  width: calc(100% - 2rem);
  border-radius: 0.8rem;
  padding: 1rem;
  flex: 1;
  min-height: 8rem;
  resize: none;
  font-family: inherit;
  color: var(--foreground-color);
  background-color: var(--background-color);
  border: solid 1px var(--foreground-color-secondary);
}
.track-item-editor-url-selector[data-v-5f4932b2] {
  display: flex;
  gap: 0.5rem;
}
.track-item-editor-link-selector[data-v-5f4932b2] {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.track-item-editor-verse-selector[data-v-5f4932b2] {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.track-item-editor-verse-selector-header[data-v-5f4932b2] {
  display: flex;
  gap: 0.25rem;
}
.verse-selector-header-item[data-v-5f4932b2] {
  width: 0;
  flex: 3;
}
.track-item-editor-verse-selector-body[data-v-5f4932b2] {
  height: 0;
  flex: 1;
  overflow: auto;
  display: flex;
  flex-direction: column;
}
.bible-verse-area[data-v-5f4932b2] {
  padding: 1rem;
  border-radius: 0.8rem;
  flex: 1;
}
.link-description-area[data-v-5f4932b2] {
  padding: 1rem;
  border-radius: 0.8rem;
  flex: 1;
}
.visual-item[data-v-5f4932b2] {
  height: 0;
  flex: 1;
  overflow: auto;
  object-fit: contain;
}


.modal-body[data-v-0d026205] {
  width: 100%;
  height: 0;
  flex: 1;
  overflow: auto;
  margin: 1rem 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  flex-wrap: wrap;
  text-align: center;
  justify-content: center;
  position: relative;
}
.modal-body-inner[data-v-0d026205]{
    flex: 1;
    display: flex;
    flex-direction: column;
    margin: 1rem;
    gap: 2rem;
    padding: 1rem;
    padding-top: 0;
}
.type-selector[data-v-0d026205]{
    display: flex;
    flex-direction: row;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}
.type-selector-option[data-v-0d026205], .type-selector-option-selected[data-v-0d026205] {
  padding: 0.5rem 1rem;
  border-radius: 0.8rem;
  border: solid 1px var(--accent-color);
  display: flex;
  gap: 0.5rem;
  user-select: none;
  cursor: pointer;
}
.type-selector-option-selected[data-v-0d026205] {
  color: var(--accent-foreground-color);
  background-color: var(--accent-color);
}
.posting-to-container[data-v-0d026205]{
  position: relative;
  width: 11rem;

  text-align: left;
  margin-left: 1rem;
  display: flex;
  flex-direction: column;
}



.items-body[data-v-4b1d61cf]{
     display: flex;
     flex-direction: column;
     position: relative;
}
.item-header[data-v-4b1d61cf] {
   font-size: 2rem;
   margin-top: 1rem;
   border-bottom: solid 1px var(--accent-color-secondary);
   font-weight: bold;
   display: flex;
   padding-bottom: 0.5rem;
   margin-bottom: 1rem;
}
.item-header-text-area[data-v-4b1d61cf] {
   flex: 1;
}
.item-header-text[data-v-4b1d61cf]{
}
.item-header-time[data-v-4b1d61cf]{
     font-weight: normal;
     font-size: 0.8rem;
     margin-top: auto;
     margin-bottom: auto;
     margin-left: 1rem;
}
.item-header-actions[data-v-4b1d61cf]{
     display: flex;
     gap: 0.5rem;
     margin-left: 0.5rem;
     margin-top: auto;
     margin-bottom: auto;
}
.item-body[data-v-4b1d61cf] {
   height: 0;
   flex: 1;
   display: flex;
   flex-direction: column;
   overflow-y: auto;
   overflow-x: hidden;
   margin-left: 1rem;
   margin-right: 1rem;
}
.item-position[data-v-4b1d61cf]{
     background-color: var(--accent-color);
     color: var(--accent-foreground-color);
     position: absolute;
     bottom: 0.5rem;
     left: 50%;
     transform: translateX(-50%);
     border-radius: 1rem;
    
     padding: 0.25rem;
     width: 25%;
     text-align: center;
}
.items-selector[data-v-4b1d61cf]{
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}
.note-item[data-v-4b1d61cf]{
    font-size: 1.3rem;
    line-height: 1.35;
}
.bible-item[data-v-4b1d61cf] {
   height: 0;
   flex: 1;
   font-size: 1.3rem;
   line-height: 1.35;
   display: flex;
   flex-direction: column;
}
.bible-item-header[data-v-4b1d61cf] {
   font-size: 2rem;
   line-height: normal;
   font-weight: bold;
   border-bottom: solid 1px var(--accent-color);
   margin-bottom: 0.5rem;
   margin-top: 0.5rem;
}
.bible-item-content[data-v-4b1d61cf] {
   height: 0;
   flex: 1;
   overflow-y: auto;
}
.visual-item-body[data-v-4b1d61cf]{
    display: flex;
    flex-direction: column;
    flex: 1;
}
.visual-item[data-v-4b1d61cf] {
   height: 0;
   flex: 1;
   overflow: auto;
   object-fit: contain;
}

 /* links read like the note text (same size), with breathing room above */
.link-item[data-v-4b1d61cf]{
   font-size: 1.3rem;
   line-height: 1.35;
   padding-top: 1rem;
}
.link-item h3[data-v-4b1d61cf] {
     font-size: 1em;
     margin: 0 0 0.35rem 0;
}
.link-item p[data-v-4b1d61cf] {
     margin: 0 0 0.75rem 0;
}
.link-button[data-v-4b1d61cf]{
  display: block;
  font-size: 1em;
  margin-top: 0.75rem;
  margin-right: 1rem;
  margin-left: 1rem;
  text-align: center;
  color: var(--accent-color);
  text-decoration: none;
}
.bookmark-item[data-v-4b1d61cf]{
}
.item-list-view[data-v-4b1d61cf] {
   height: 0;
   flex: 1;
   overflow-y: auto;
   overflow-x: hidden;
   margin-top: 0.5rem;
   display: flex;
   flex-direction: column;
   gap: 0.5rem;
}
.item-list-entry[data-v-4b1d61cf] {
   border-radius: 0.8rem;
   padding: 0.6rem 0.8rem;
   background-color: var(--background-color-secondary);
   border: solid 1px transparent;
}
.item-list-entry-active[data-v-4b1d61cf] {
   border-color: var(--accent-color);
}
.item-list-entry-header[data-v-4b1d61cf] {
   display: flex;
   gap: 0.5rem;
   justify-content: space-between;
   flex-wrap: wrap;
   margin-bottom: 0.25rem;
}
.item-list-entry-type[data-v-4b1d61cf] {
   font-weight: bold;
}
.item-list-entry-meta[data-v-4b1d61cf] {
   font-size: 0.85rem;
   opacity: 0.8;
}
.item-list-entry-text[data-v-4b1d61cf] {
   font-size: 1rem;
   line-height: 1.35;
   overflow-wrap: anywhere;
}
.item-list-entry-visual img[data-v-4b1d61cf], .item-list-entry-visual video[data-v-4b1d61cf] {
   display: block;
   max-width: 100%;
   max-height: 10rem;
   object-fit: contain;
   border-radius: 0.5rem;
}
@media screen and (max-width: 1000px) {
.note-item[data-v-4b1d61cf], .bible-item[data-v-4b1d61cf], .link-item[data-v-4b1d61cf] {
     font-size: 1.1rem;
}
}


.item-body p {
  margin-top: 0;
  margin-bottom: 0;
  margin-block-start: 0;
  margin-block-end: 0;
  margin: 0;
  padding: 0;
}


.iq-container[data-v-6ab7b53a] {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.iq-header[data-v-6ab7b53a] {
  width: min(10rem, calc(50vw - 4rem));
  text-align: center;
  font-weight: bold;
  border: solid 1px var(--accent-color);
  padding: 0.3rem;
  border-radius: 0.8rem;
  user-select: none;
  cursor: pointer;
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
  margin-left: auto;
  margin-right: auto;
}
.iq-description[data-v-6ab7b53a] {
  font-size: 0.8rem;
  text-align: center;
  opacity: 0.8;
  font-style: italic;
}
.iq-list[data-v-6ab7b53a] {
  flex: 1;
  height: 0;
  overflow: auto;
}
.iq-add-container[data-v-6ab7b53a] {
  display: flex;
  justify-content: center;
}
.iq-post-options[data-v-6ab7b53a] {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 0.5rem;
  border-radius: 0.8rem;
  border: solid 1px var(--background-color-secondary);
}
.iq-post-option[data-v-6ab7b53a] {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.iq-post-option-label[data-v-6ab7b53a] {
  width: 6rem;
  font-size: 0.9rem;
  font-weight: bold;
}
.iq-post-option-inputs[data-v-6ab7b53a] {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
}
.iq-number-input[data-v-6ab7b53a] {
  width: 3.5rem;
  text-align: center;
  border-radius: 0.6rem;
}
.iq-unit[data-v-6ab7b53a] {
  font-size: 0.85rem;
  opacity: 0.8;
  min-width: 2rem;
}
.iq-chip[data-v-6ab7b53a] {
  padding: 0.15rem 0.6rem;
  border-radius: 0.8rem;
  border: solid 1px var(--accent-color);
  color: var(--accent-color);
  font-size: 0.85rem;
  user-select: none;
  cursor: pointer;
}
.iq-chip-selected[data-v-6ab7b53a] {
  color: var(--accent-foreground-color);
  background-color: var(--accent-color);
}
.iq-add-button[data-v-6ab7b53a] {
  width: 3rem;
  height: 3rem;
  border-radius: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  color: var(--accent-foreground-color);
  background-color: var(--accent-color);
  user-select: none;
  cursor: pointer;
  transition: all ease-in-out 0.25s;
}
.iq-add-button[data-v-6ab7b53a]:hover {
    transform: scale(1.01);
}
.iq-list-item[data-v-6ab7b53a] {
  margin: 0.5rem;
  padding: 1rem;
  border-radius: 0.8rem;
  background-color: var(--background-color-secondary);
  display: flex;
  cursor: pointer;
}
.iq-list-item-text[data-v-6ab7b53a] {
  width: 0;
  flex: 1;
  font-size: 1.4rem;
  font-weight: bold;
}
.iq-list-item-actions[data-v-6ab7b53a] {
  display: flex;
  gap: 1rem;
}
.preview-modal-body[data-v-6ab7b53a] {
  height: 0;
  flex: 1;
  margin: 2rem;
  display: flex;
  flex-direction: column;
}


.timeline-container[data-v-3e84a469] {

  display: flex;
  flex-direction: column;
  justify-content: start;
}
.timeline-bar-container[data-v-3e84a469]{
    padding-top: 0rem;
    padding-bottom: 2rem;
    display: flex;
    justify-content: start;
}
.timeline-bar[data-v-3e84a469] {
  flex: 1;
  min-height: 2rem;
  border: solid 1px var(--accent-color);
  border-radius: 0.6rem;
  cursor: pointer;
  margin: auto 0rem;
  position: relative;
}
.timeline-bar-indicator-container[data-v-3e84a469] {
  height: 2rem;
  border-radius: 0.6rem;
  overflow: hidden;
  position: relative;
}
.timeline-time-indicator[data-v-3e84a469] {
  position: absolute;
  z-index: 1;
  border-radius: 0.6rem;
  background-color: var(--accent-color);
  left: 0;
  top: 0;
  height: 2rem;
  pointer-events: none;
}
.timeline-time-marker[data-v-3e84a469] {
  position: absolute;
  z-index: 2;
  
  height: 2rem;
  top: 0;
  min-width: 1px;
  background-color: var(--foreground-color);
  opacity: 0.3;
  pointer-events: none;
}
.timeline-note-above[data-v-3e84a469], .timeline-note-below[data-v-3e84a469] {
  position: absolute;
  padding: 0.1rem 0.5rem;
  background: var(--foreground-color);
  color: var(--background-color);
  font-size: 1rem;
  border-radius: 2rem;
  min-width: 1rem;
  min-height: calc(1rem - 0.2rem);
  z-index: 5;
  text-align: center;
}
.timeline-note-above[data-v-3e84a469] {
  top: 0.25rem;
  color: var(--accent-color);
  background: var(--accent-foreground-color);
  box-shadow: 0 0px 10px 1px color-mix(in srgb, var(--accent-color) 20%, #99999900 70%);
}
.timeline-note-center[data-v-3e84a469]{
    transform: translateX(-50%);
}
.timeline-note-below[data-v-3e84a469] {
  top: calc(100% + 0.25rem);
}
.play-pause-button[data-v-3e84a469] {
  color: var(--foreground-color);
  border: solid 1px var(--foreground-color);
  display: flex;
  flex-direction: column;
  width: 3rem;
  height: 3rem;
  padding: 1rem;
  border-radius: 100%;
  user-select: none;
  cursor: pointer;
  text-align: center;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
}
.play-pause-button-icon[data-v-3e84a469] {
  width: 2.5rem;
  height: 2.5rem;
  margin: auto;
}


.audio-container[data-v-23c1fc24]{
    flex: 1;
    display: flex;
    flex-direction: column;
    padding-top: 1rem;
    padding-bottom: 1rem;
}
.audio-thumbnail[data-v-23c1fc24]{
    flex: 1;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    margin-bottom: 1rem;
}


.loading-container {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  outline: solid 1px var(--accent-color);
  transform: rotate(90deg);
  animation: spin 3s infinite ease-in-out; /* Added animation */
}
.loading-icon {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.bar {
  width: 20%;
  height: 100%;
  background-color: var(--accent-color);
  animation: wave 1.5s infinite cubic-bezier(0.17, 0.67, 0.83, 0.67) alternate;
  transform-origin: center;
  border-radius: 10px;
  animation: rotate 3s infinite ease-in-out; /* Added animation */
}
.bar:nth-child(1) {
    animation-delay: 0s;
}
.bar:nth-child(2) {
    animation-delay: 0.2s;
}
.bar:nth-child(3) {
    animation-delay: 0.4s;
}
.bar:nth-child(4) {
    animation-delay: 0.6s;
}
.horizontal-bar {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 80%; /* Initial width */
  height: 5px;
  background-color: var(--shadow);
  transform: translate(-50%, -50%); /* Center the bar */
  animation: scaleAndFlip 3s infinite ease-in-out; /* Added animation */
  display: none;
}
@keyframes rotate {
from {
    transform: rotate3d(0.5,0.5,0.5, 360deg);
}
to {
    transform: rotate3d(0deg);
}
}
@keyframes wave {
0% {
    transform: scaleY(0.4);
}
25% {
    transform: scaleY(1);
}
75% {
    transform: scaleY(0.6);
}
100% {
    transform: scaleY(0.4);
}
}
@keyframes scaleAndFlip {
0% {
    transform: translate(-50%, -50%) scaleY(1) rotate(0deg); /* Initial state */
}
35% {
    transform: translate(-50%, -50%) scaleY(10); /* Scale up */
}
35.1% {
    transform: translate(-50%, -50%) scaleY(10) rotate(0deg); /* Flip */
}
65% {
    transform: translate(-50%, -50%) scaleY(10) rotate(180deg); /* Flip */
}
100% {
    transform: translate(-50%, -50%) scaleY(1) rotate(180deg); /* Return to original size, flipped */
}
}
@keyframes spin {
from {
    transform: rotateZ(0deg);
}
to {
    transform: rotateZ(360deg);
}
}



.blog-container[data-v-68a20014]{
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.sb-frame[data-v-68a20014] {
  position: absolute;
  top: 0;
  left: 0;

  flex: 1;
  height: 150%;
  width: 150%;
  border: solid 1px #eee;
  border-radius: 0.4rem;
  transform-origin: top left;
  scale: 0.66;
  background-color: #fff;
  transition: all ease-in-out 1s;
}
.sb-frame[data-v-68a20014]::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}
.sb-frame[data-v-68a20014]::-webkit-scrollbar-track {
    background: transparent;
    border: none;
    border-radius: 4px;
}
.sb-frame[data-v-68a20014]::-webkit-scrollbar-thumb {
    background: #de761c;
    border-radius: 4px;
}




.blog-container[data-v-0ae388de] {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.sb-frame[data-v-0ae388de] {
  position: absolute;
  top: 0;
  left: 0;
  flex: 1;
  height: 150%;
  width: 150%;
  border: solid 1px #eee;
  border-radius: 0.4rem;
  transform-origin: top left;
  scale: 0.66;
  background-color: #fff;
  transition: all ease-in-out 1s;
}
.sb-frame[data-v-0ae388de]::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}
.sb-frame[data-v-0ae388de]::-webkit-scrollbar-track {
    background: transparent;
    border: none;
    border-radius: 4px;
}
.sb-frame[data-v-0ae388de]::-webkit-scrollbar-thumb {
    background: #de761c;
    border-radius: 4px;
}


.blog-container[data-v-b079e0b8] {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.sb-frame[data-v-b079e0b8] {
  position: absolute;
  top: 0;
  left: 0;
  flex: 1;
  height: 150%;
  width: 150%;
  border: solid 1px #eee;
  border-radius: 0.4rem;
  transform-origin: top left;
  scale: 0.66;
  background-color: #fff;
  transition: all ease-in-out 1s;
}
.sb-frame[data-v-b079e0b8]::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}
.sb-frame[data-v-b079e0b8]::-webkit-scrollbar-track {
    background: transparent;
    border: none;
    border-radius: 4px;
}
.sb-frame[data-v-b079e0b8]::-webkit-scrollbar-thumb {
    background: #de761c;
    border-radius: 4px;
}


.rb-container[data-v-c1bd8f16] {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.rb-container input[data-v-c1bd8f16] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom radio button */
.rb-indicator[data-v-c1bd8f16] {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: var(--foreground-color-secondary);
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.rb-container:hover input ~ .rb-indicator[data-v-c1bd8f16] {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.rb-container input:checked ~ .rb-indicator[data-v-c1bd8f16] {
  background-color: var(--accent-color);
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.rb-indicator[data-v-c1bd8f16]:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.rb-container input:checked ~ .rb-indicator[data-v-c1bd8f16]:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.rb-container .rb-indicator[data-v-c1bd8f16]:after {
  top: 9px;
  left: 9px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: white;
}
/* Customize the label (the container) */
.cb-container[data-v-c1bd8f16] {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

  /* Hide the browser's default checkbox */
.cb-container input[data-v-c1bd8f16] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

/* Create a custom checkbox */
.cb-checkmark[data-v-c1bd8f16] {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: var(--foreground-color-secondary);
}

/* On mouse-over, add a grey background color */
.cb-container:hover input ~ .cb-checkmark[data-v-c1bd8f16] {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.cb-container input:checked ~ .cb-checkmark[data-v-c1bd8f16] {
  background-color: var(--accent-color);
}

/* Create the checkmark/indicator (hidden when not checked) */
.cb-checkmark[data-v-c1bd8f16]:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.cb-container input:checked ~ .cb-checkmark[data-v-c1bd8f16]:after {
  display: block;
}

/* Style the checkmark/indicator */
.cb-container .cb-checkmark[data-v-c1bd8f16]:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}



.quill-input[data-v-ef6fb176] {
  font-size: 1.1rem;
  font-weight: normal;
  width: 100%;
  border: solid 1px var(--foreground-color);
  border-bottom-left-radius: 0.4rem;
  border-bottom-right-radius: 0.4rem;
  padding: 0.5rem;
  height: 250px;
}


.quiz-container-outer[data-v-01b9d542] {
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 0.5rem;
}
.quiz-container-inner[data-v-01b9d542] {
  display: flex;
  flex-direction: column;
  flex: 1;
  height: 0;
  position: relative;
}
.quiz-name[data-v-01b9d542]{
    font-size: 1.1rem;
    font-weight: bold;
    border-bottom: solid 1px var(--accent-color-secondary);
    margin-bottom: 1rem;
}
.quiz-content[data-v-01b9d542]{
  height: 0;
  flex: 1;
  overflow: auto;
  overflow-x: hidden;
  position: relative;
  z-index: 1;
  /* leave room for the arrows, which now sit at the vertical center of the content */
  padding-left: 2.5rem;
  padding-right: 2.5rem;
}
.prev-button[data-v-01b9d542], .next-button[data-v-01b9d542] {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  user-select: none;
  cursor: pointer;
  width: 3rem;
  height: 3rem;
  border-radius: 100%;
  color: var(--accent-foreground-color);
  background-color: var(--accent-color);
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  z-index: 2;
  opacity: 0.5;
  transition: all ease-in-out 0.3s;
}
.prev-button[data-v-01b9d542]:hover, .next-button[data-v-01b9d542]:hover{
    opacity: 1;
}
.prev-button[data-v-01b9d542]{
    left: -0.75rem;
}
.next-button[data-v-01b9d542]{
    right: -0.75rem;
}
.quiz-button-icon[data-v-01b9d542]{
    font-size: 2rem;
    margin: auto;
}
@media screen and (max-width: 1000px) {
.prev-button[data-v-01b9d542], .next-button[data-v-01b9d542] {
    width: 2.5rem;
    height: 2.5rem;
}
.quiz-button-icon[data-v-01b9d542] {
    font-size: 1.5rem;
}
.quiz-content[data-v-01b9d542] {
    padding-left: 2rem;
    padding-right: 2rem;
}
}
.submit-screen[data-v-01b9d542]{
    text-align: center;
}
.submit-screen-header[data-v-01b9d542] {
    font-size: 2rem;
}
.submit-screen-results[data-v-01b9d542]{
    font-size: 4rem;
    margin-bottom: 2rem;
}
.sb-frame[data-v-01b9d542] {
  position: absolute;
  top: 0;
  left: 0;
  flex: 1;
  height: 150%;
  width: 150%;
  border: solid 1px #eee;
  border-radius: 0.4rem;
  transform-origin: top left;
  scale: 0.66;
  background-color: #fff;
  transition: all ease-in-out 1s;
}
.sb-frame[data-v-01b9d542]::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}
.sb-frame[data-v-01b9d542]::-webkit-scrollbar-track {
    background: transparent;
    border: none;
    border-radius: 4px;
}
.sb-frame[data-v-01b9d542]::-webkit-scrollbar-thumb {
    background: #de761c;
    border-radius: 4px;
}
.slide-in-enter-active[data-v-01b9d542], .slide-in-leave-active[data-v-01b9d542] {
  transition: all .5s ease-in-out;
  position: absolute;
  top: 0;
  width: 100%;
}
.slide-in-enter[data-v-01b9d542], .slide-in-leave-to[data-v-01b9d542] /* .slide-in-leave-active below version 2.1.8 */ {
  opacity: 0;
}
.slide-in-enter[data-v-01b9d542] {
  transform: translateX(50vw);
}
.slide-in-leave-to[data-v-01b9d542] {
  transform: translateX(-50vw);
}


.txt-container[data-v-409fbc0d] {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.sb-frame[data-v-409fbc0d] {
  height: 0;
  flex: 1;
  overflow-y: auto;
  border: solid 1px #eee;
  border-radius: 0.4rem;
  transition: all ease-in-out 1s;
}
.txt-contents[data-v-409fbc0d] {
  padding: 1rem;
}
@media screen and (max-width: 1000px) {
.txt-contents[data-v-409fbc0d]{
}
}


/* LOOP-INSPIRED TYPOGRAPHY & UI — SCOPED TO .txt-contents */
.txt-contents {
  /* Design tokens */
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "DejaVu Sans Mono", "Courier New", monospace;
  --shadow-1: 0 1px 2px var(--shadow), 0 1px 1px var(--shadow);
  --radius-1: 0.6rem;
  --radius-2: 0.8rem;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --measure: 620px; /* comfortable reading width */
  --zebra: rgba(0, 0, 0, 0.03);
  font-size: 16px;
  line-height: 1.65;
  color-scheme: light dark;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}



  /* Selection */
.txt-contents ::selection {
    background: color-mix(in srgb, var(--accent-color) 25%, transparent);
}

  /* Layout + rhythm */
.txt-contents > :not(:where(style, script)) {
    margin-block: 0;
}
.txt-contents p,
  .txt-contents blockquote,
  .txt-contents ul,
  .txt-contents ol,
  .txt-contents dl,
  .txt-contents pre {
    max-width: var(--measure);
    margin-left: auto;
    margin-right: auto;
}

  /* Headings */
.txt-contents h1,
  .txt-contents h2,
  .txt-contents h3,
  .txt-contents h4,
  .txt-contents h5,
  .txt-contents h6 {
    max-width: var(--measure);
    margin-left: auto;
    margin-right: auto;
    line-height: 1.25;
    letter-spacing: 0;
    color: var(--foreground-color);
    text-wrap: balance;
    margin-bottom: var(--space-1);
}
.txt-contents h1 {
    font-weight: 700;
    font-size: clamp(1.875rem, 1.25rem + 2.2vw, 2.75rem);
    margin-top: var(--space-6);
}
.txt-contents h2 {
    font-weight: 700;
    font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.25rem);
    margin-top: var(--space-6);
}
.txt-contents h3 {
    font-weight: 600;
    font-size: clamp(1.25rem, 1.05rem + 0.9vw, 1.75rem);
    margin-top: var(--space-5);
}
.txt-contents h4 {
    font-weight: 600;
    font-size: 1.125rem;
    margin-top: var(--space-4);
}
.txt-contents h5 {
    font-weight: 600;
    font-size: 1.0625rem;
    margin-top: var(--space-4);
}
.txt-contents h6 {
    font-weight: 600;
    font-size: 1rem;
    margin-top: var(--space-3);
}

  /* Indents */
.txt-contents .ql-indent-1 {
    padding-left: 2rem;
    max-width: calc(var(--measure) - calc(2rem * 2));
}
.txt-contents .ql-indent-2 {
    padding-left: 4rem;
    max-width: calc(var(--measure) - calc(4rem * 2));
}
.txt-contents .ql-indent-3, .ql-indent-4, .ql-indent-5, .ql-indent-6 {
    padding-left: 6rem;
    max-width: calc(var(--measure) - calc(6rem * 2));
}

  

  /* Paragraphs */
.txt-contents p {
    margin-top: 0;
    margin-bottom: 0;
}
.txt-contents p + p {
}

  /* Links */
.txt-contents a {
    color: var(--accent-color);
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1.5px;
}
.txt-contents a:hover {
      text-decoration-thickness: 2px;
}
.txt-contents a:focus-visible {
      outline: 3px solid color-mix(in srgb, var(--accent-color) 40%, transparent);
      outline-offset: 2px;
      border-radius: 4px;
}

  /* Lists */
.txt-contents ul,
  .txt-contents ol {
    margin-top: 0rem;
    padding-left: 4rem;
}
.txt-contents li {
    margin-top: 0rem;
}
.txt-contents li + li {
      margin-top: 0rem;
}
.txt-contents li::marker {
      color: color-mix(in srgb, var(--foreground-color) 50%, transparent);
}
.txt-contents ul ul,
  .txt-contents ol ol,
  .txt-contents ul ol,
  .txt-contents ol ul {
    margin-top: 4px;
}

  /* Blockquotes */
.txt-contents blockquote {
    position: relative;
   
    max-width: calc(var(--measure) - calc(var(--space-4) * 2) - calc(var(--space-5) * 2));
    padding: var(--space-3) var(--space-4);
    border-left: 4px solid var(--accent-color);
    background: var(--surface-2);
    border-radius: 0 var(--radius-2) var(--radius-2) 0;
    color: var(--foreground-color);
}

  /* Code */
.txt-contents pre, code {
    margin-top: var(--space-2);
    margin-bottom: var(--space-2);
    font-family: unset;
    background: var(--surface-2);
    border: 1px solid var(--accent-color);
    border-radius: var(--radius-2);
    padding: var(--space-3) var(--space-5);
    overflow: auto;
    white-space: pre-wrap;
    box-shadow: var(--shadow-1);
    max-width: calc(var(--measure) - calc(var(--space-5) * 2) );
}
.txt-contents pre code {
      display: block;
      padding: 0;
      border: 0;
      background: none;
      font-size: 0.95em;
      line-height: 1.6;
      white-space: pre;
}

  /* Tables */
.txt-contents table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid var(--accent-color);
    border-radius: var(--radius-2);
    overflow: hidden;
}
.txt-contents th,
  .txt-contents td {
    padding: 10px 12px;
    text-align: left;
    border-bottom: 1px solid var(--accent-color);
    vertical-align: top;
}
.txt-contents thead th {
    background: var(--surface-2);
    font-weight: 700;
}
.txt-contents tbody tr:nth-child(even) {
    background: var(--zebra);
}
.txt-contents caption {
    caption-side: bottom;
    color: var(--foreground-color-secondary);
    padding: var(--space-3);
    font-size: 0.925rem;
}

  /* Horizontal rule */
.txt-contents hr {
    border: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--accent-color), transparent);
}

  /* Images, media, figures */
.txt-contents img,
  .txt-contents video,
  .txt-contents svg {
    max-width: 100%;
    height: auto;
    border-radius: var(--radius-2);
    box-shadow: var(--shadow-1);
}
.txt-contents figure {
    margin: 0;
}
.txt-contents figcaption {
    margin-top: 8px;
    color: var(--foreground-color-secondary);
    font-size: 0.95rem;
}

  /* Emphasis, misc inline */
.txt-contents strong {
    font-weight: 700;
}
.txt-contents em {
    font-style: italic;
}
.txt-contents mark {
    background: color-mix(in srgb, var(--accent-color) 20%, transparent);
    color: inherit;
    padding: 0 0.2em;
    border-radius: 3px;
}
.txt-contents kbd {
    font-family: var(--font-mono);
    font-size: 0.9em;
    padding: 0.15em 0.4em;
    border-radius: 4px;
    border: 1px solid var(--accent-color);
    background: var(--surface-2);
    box-shadow: inset 0 -1px 0 rgba(0,0,0,0.08);
}

  /* Sup / Sub / Small */
.txt-contents sup,
  .txt-contents sub {
    font-size: 0.8em;
    line-height: 0;
}
.txt-contents sup {
    vertical-align: super;
}
.txt-contents sub {
    vertical-align: sub;
}
.txt-contents small {
    font-size: 0.925rem;
    color: var(--foreground-color-secondary);
}

  /* Definition lists */
.txt-contents dl {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 6px 16px;
}
.txt-contents dt {
    font-weight: 600;
}
.txt-contents dd {
    margin: 0;
    color: var(--foreground-color);
}

  /* Details/Summary */
.txt-contents details {
    border: 1px solid var(--accent-color);
    border-radius: var(--radius-2);
    background: var(--surface);
    box-shadow: var(--shadow-1);
}
.txt-contents summary {
    cursor: pointer;
    padding: 10px 12px;
    font-weight: 600;
    list-style: none;
}
.txt-contents summary::-webkit-details-marker {
      display: none;
}
.txt-contents details[open] summary {
    border-bottom: 1px solid var(--accent-color);
}
.txt-contents details > *:not(summary) {
    padding: 10px 12px;
}

  /* Forms (basic) */
.txt-contents label {
    display: inline-block;
    margin-bottom: 6px;
    font-weight: 600;
}
.txt-contents input[type="text"],
  .txt-contents input[type="email"],
  .txt-contents input[type="url"],
  .txt-contents input[type="search"],
  .txt-contents input[type="number"],
  .txt-contents input[type="password"],
  .txt-contents select,
  .txt-contents textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--accent-color);
    border-radius: var(--radius-2);
    background: var(--surface);
    color: var(--foreground-color);
    outline: none;
    transition: border-color 120ms ease, box-shadow 120ms ease;
}
.txt-contents input::placeholder,
    .txt-contents textarea::placeholder {
      color: var(--foreground-color-secondary);
}
.txt-contents input:focus,
    .txt-contents select:focus,
    .txt-contents textarea:focus {
      border-color: var(--accent-color);
      box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-color) 25%, transparent);
}
.txt-contents button,
  .txt-contents input[type="submit"] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: var(--radius-2);
    border: 1px solid transparent;
    background: var(--accent-color);
    color: var(--accent-color-secondary);
    font-weight: 600;
    cursor: pointer;
    box-shadow: var(--shadow-1);
    transition: transform 80ms ease, filter 120ms ease;
}
.txt-contents button:hover,
    .txt-contents input[type="submit"]:hover {
      filter: brightness(1.03);
}
.txt-contents button:active,
    .txt-contents input[type="submit"]:active {
      transform: translateY(1px);
}

  /* Utilities */
.txt-contents .muted {
    color: var(--foreground-color-secondary);
}
.txt-contents .lead {
    font-size: 1.125rem;
    line-height: 1.6;
    color: var(--foreground-color-secondary);
    max-width: var(--measure);
}
@media screen and (max-width: 620px) {

  /* Lists */
.txt-contents ul,
  .txt-contents ol {

    padding-left: 2rem;
}
}


.blog-container[data-v-118a85f8] {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.sb-frame[data-v-118a85f8] {
  height: 0;
  flex: 1;
  overflow-y: auto;
  border: solid 1px #eee;
  border-radius: 0.4rem;
  transition: all ease-in-out 1s;
}


.tv-container[data-v-f6a3f81a] {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.tv-follow-footnote[data-v-f6a3f81a] {
  margin-top: 0.75rem;
  font-size: 0.85rem;
  line-height: 1.35;
  opacity: 0.8;
  padding: 0.6rem 0.85rem;
  border-radius: 0.8rem;
  background-color: var(--background-color-secondary);
}
.tv-display[data-v-f6a3f81a]{
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    min-height: 0;
}
.tv-display-icon[data-v-f6a3f81a] {
  margin: 0 auto;
  width: 10rem;
  height: 10rem;
  opacity: 0.5;
  color: var(--accent-color-secondary);
}
.tv-follow-info[data-v-f6a3f81a] {
  display: none;
}

/* phones: the player area is shrunk while following, so lay this out compactly */
@media screen and (max-width: 1000px) {
.tv-container[data-v-f6a3f81a] {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}
.tv-display[data-v-f6a3f81a] {
    flex-direction: row;
    align-items: center;
    gap: 0.75rem;
}
.tv-display-icon[data-v-f6a3f81a] {
    margin: 0;
    width: 2.5rem;
    height: 2.5rem;
}
.tv-container[data-v-f6a3f81a] {
    min-height: 0;
    overflow: hidden;
}
.tv-display-label[data-v-f6a3f81a] {
    font-weight: bold;
}
.tv-follow-info[data-v-f6a3f81a] {
    display: block;
    margin-left: auto;
    font-size: 0.85rem;
    color: var(--accent-color);
    cursor: pointer;
    user-select: none;
    white-space: nowrap;
}

  /* the full note overflowed the small player area- it's behind 'How it works' on phones */
.tv-follow-footnote[data-v-f6a3f81a] {
    display: none;
}
}


.content-outer[data-v-e1bb2a98] {
  position: relative;
  background-color: var(--background-color);
  z-index: 2;
  touch-action: none; /* pan/zoom handled by JS here */
  user-select: none;
  overflow: hidden;
}
.panzoom-overlay[data-v-e1bb2a98] {
  position: absolute;
  inset: 0;
  z-index: 9999;
  background: transparent;
  user-select: none;
  touch-action: none; /* critical: let JS fully own gestures here */
}


.content-inner[data-v-84584f5a] {
  position: absolute;
  left: var(--circle-padding);
  top: var(--circle-padding);
  width: calc(100% - calc(2 * var(--circle-padding)));
  height: calc(100% - calc(2 * var(--circle-padding)));
  background-color: var(--background-color);
  z-index: 10;
  user-select: none;
}
.track-container[data-v-84584f5a] {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.track[data-v-84584f5a] {
  height: 0;
  flex: 1;
  border: solid 1px var(--accent-color);
  border-radius: 0.8rem;
  padding: var(--circle-padding);
  touch-action: pan-y; /* allow vertical scroll */
}
.content-navigator-short[data-v-84584f5a] {
  display: flex;
}
.content-navigator-short-button-prev[data-v-84584f5a], .content-navigator-short-button-next[data-v-84584f5a], .content-navigator-short-button-noop[data-v-84584f5a] {
  width: 2rem;
  font-size: 1.5rem;
  font-weight: normal;
  user-select: none;
  cursor: pointer;
  padding: 0.5rem;
  text-align: center;
  border-radius: 0.6rem;
  border: solid 1px var(--accent-color);
}
.content-navigator-short-button-prev[data-v-84584f5a], .content-navigator-short-button-noop[data-v-84584f5a] {
  color: var(--accent-color);
  background-color: var(--background-color);
}
.content-navigtor-short-button-next[data-v-84584f5a] {
  color: var(--accent-foreground-color);
  background-color: var(--accent-color);
}
.content-navigator-short-button-noop[data-v-84584f5a] {
  cursor: auto;
}
.track-header[data-v-84584f5a] {
  user-select: none;
  cursor: pointer;
  text-align: center;
  font-weight: bold;
  font-size: 1.5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-overflow: ellipsis;
}
.content-navigator[data-v-84584f5a] {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.content-container[data-v-84584f5a] {
  height: 0;
  flex: 1;
  overflow: auto;
  width: min(50rem, 100%);
  margin-left: auto;
  margin-right: auto;
}
.content-collection-entry[data-v-84584f5a] {
  display: flex;
  flex-direction: column;
  font-size: 1.6rem;
  border-bottom: solid 1px var(--foreground-color-secondary);
  padding: 1rem;
}
.content-collection-name[data-v-84584f5a] {
  user-select: none;
  cursor: pointer;
  transition: all ease-in-out 0.5s;
  display: flex;
  gap: 0.5rem;
  font-weight: bold;
}
.content-collection-name[data-v-84584f5a]:hover {
    transform: scale(1.01);
}
.content-collection-track-section-name[data-v-84584f5a] {
  font-weight: normal;
  margin-top: 1.5rem;
}
.content-collection-tracks[data-v-84584f5a] {
  margin-top: 0.5rem;
  margin-left: 1.25rem;
}
.cctc-first[data-v-84584f5a], .cctc-mid[data-v-84584f5a], .cctc-last[data-v-84584f5a] {
  border: solid 1px transparent;
  border-left-color: var(--accent-color);
  border-right-color: var(--accent-color);
}
.cctc-first[data-v-84584f5a] {
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;
  border-top-color: var(--accent-color);
  border-bottom: none;
}
.cctc-mid[data-v-84584f5a] {
  border-bottom: none;
  border-top: none;
}
.cctc-last[data-v-84584f5a] {
  border-top: none;
  border-bottom-color: var(--accent-color);
  border-bottom-left-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
  margin-bottom: 1.5rem;
}
.content-collection-track[data-v-84584f5a] {
  user-select: none;
  cursor: pointer;
  transition: all ease-in-out 0.5s;
  display: flex;
  border-radius: 0.5rem;
  gap: 0.5rem;
  padding: 0.5rem 0.25rem;
}
.content-collection-track[data-v-84584f5a]:hover {
    transform: scale(1.01);
}
.scn-button[data-v-84584f5a], .scn-button-alt[data-v-84584f5a] {
  font-size: 1.4rem;
  font-weight: bold;
  user-select: none;
  cursor: pointer;
  padding: 0.5rem;
  text-align: center;
  border-radius: 0.8rem;
  border: solid 1px var(--accent-color);
  width: min(50rem, calc(100% - 2rem));
  margin-left: auto;
  margin-right: auto;
}
.scn-button-alt[data-v-84584f5a] {
  color: var(--accent-color);
  background-color: var(--background-color);
}
.scn-button[data-v-84584f5a] {
  color: var(--accent-foreground-color);
  background-color: var(--accent-color);
}
.save-in-circle-button[data-v-84584f5a] {
  display: inline-block;
  font-size: 0.8rem;
  font-weight: bold;
  color: var(--accent-foreground-color);
  background-color: var(--accent-color);
  user-select: none;
  cursor: pointer;
  padding: 0.5rem;
  text-align: center;
  border-radius: 0.8rem;
  float: right;
}
.collection-selector[data-v-84584f5a] {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.collection-selector-collections[data-v-84584f5a] {
  height: 0;
  flex: 5;
}
.filler[data-v-84584f5a] {
  flex: 2;
}
.tooltip[data-v-84584f5a] {
  transition: all 0.3s ease-in-out;
  position: absolute;
  cursor: pointer;
  user-select: none;
  opacity: 0.15;
  z-index: 4;
  background-color: #575757;
  padding: 0.5rem;
  border-radius: 50%;
  color: #fff;
}

  /* Tooltip text */
.tooltip .tooltiptext[data-v-84584f5a] {
    display: none;
    width: 100px;
    background-color: #575757;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;
    top: 0.25rem;
    right: 105%;
    position: absolute;
    z-index: 10;
}

  /* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext[data-v-84584f5a] {
    display: block;
}
.tooltip[data-v-84584f5a]:hover {
    opacity: 0.8;
}
@media screen and (max-width: 1000px) {
.scn-button[data-v-84584f5a], .scn-button-alt[data-v-84584f5a] {
    font-size: 1.1rem;
}
.filler[data-v-84584f5a] {
    flex: unset;
}
.track-container[data-v-84584f5a] {
    gap: 0.5rem;
}
.content-navigator-short-button-prev[data-v-84584f5a], .content-navigator-short-button-next[data-v-84584f5a] {
}
.track-header[data-v-84584f5a] {
    font-size: 1rem;
}
}


.messages-body {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.message-area {
  height: 0;
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
}
.message-divider {
  height: 1px;
  background-color: var(--background-color-secondary);
}
.message-disclaimer {
  margin-top: -0.75rem;
  margin-bottom: -0.25rem;
  font-size: 0.65rem;
  line-height: 1.25;
  text-align: center;
  opacity: 0.6;
  padding: 0 0.5rem;
}
.message-me, .message-them {
  margin-top: 1rem;
  margin-bottom: 1rem;
}
.message-me {
  margin-left: 15%;
}
.message-them {
  margin-right: 15%;
}
.message-bubble {
  border-radius: 0.9rem;
  padding: 0.7rem;
  border: solid 1px var(--foreground-color);
  color: var(--foreground-color);
  position: relative;
  font-size: 15px;
  font-weight: 500;
}
.remove-button, .edit-button {
  position: absolute;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 100%;
  padding: 0.25rem;
  top: -0.5rem;
  right: 0rem;
  color: var(--accent-foreground-color);
  background-color: var(--accent-color);
  display: flex;
  flex-direction: column;
  justify-content: center;
  user-select: none;
  cursor: pointer;
}
.remove-button-icon, .edit-button-icon{
    margin: auto;
    width: 1.25rem;
    height: 1.25rem;
}
.edit-button{
    
    right: 2.5rem;
}
.message-me .message-bubble {
  border: solid 1px var(--accent-color);
}
.message-replies {
  margin-left: 1rem;
  margin-right: 1rem;
  border-radius: 1rem;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  padding: 0.1rem 1rem;
  background-color: var(--background-color-secondary);
  position: relative;
  height: 1.5rem;
  overflow: hidden;
  transition: height 0.3s ease-in-out;
  -webkit-tap-highlight-color: transparent;
}
.message-bubble-hover {
  position: absolute;
  inset: 0;
  box-sizing: border-box;
  border-radius: 0.9rem;
  background: var(--background-color-secondary); /* fully opaque: nothing shows through */
  padding: 0.5rem;
  display: flex;
  gap: 0.5rem;
  overflow-x: auto;
  overflow-y: hidden;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
  transition: opacity 0.2s ease-in-out, visibility 0s linear 0.2s;
}

/* Touch: open state set by tap */
.message-replies.bubble-open {
  height: 3rem;
}
.message-replies.bubble-open .message-bubble-hover {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity 0.2s ease-in-out, visibility 0s;
}

/* Desktop: real hover only */
@media (hover: hover) and (pointer: fine) {
.message-replies:hover .message-bubble-hover {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity 0.2s ease-in-out, visibility 0s;
}
.message-replies:has(.message-bubble-hover:hover) {
    height: 3rem;
}
.bubble-action-button:hover {
    transform: scale(1.4);
}
}
.bubble-action-button {
  cursor: pointer;
  width: 2rem;
  height: 2rem;
  flex-shrink: 0;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--background-color);
  -webkit-tap-highlight-color: transparent;
  transition: all 0.25s ease-in-out;
}
.bubble-action-button:active {
    transform: scale(1.4);
}
.bubble-action-button-selected {
    color: var(--accent-foreground-color);
    background-color: var(--accent-color);
}
.bubble-action-button-icon {
  color: var(--accent-color);
  font-size: 1.4rem;
}
.bubble-action-button-selected .bubble-action-button-icon {
  color: var(--background-color);
}
.message-footer {
  padding-left: 1rem;
  padding-right: 1rem;
  font-style: italic;
  opacity: 0.5;
  display: flex;
}
.send-area {
  display: flex;
  width: 100%;
}
.send-text-area {
  flex: 1;
  outline: none;
  resize: none;
  border-radius: 0.9rem;
  border: 1px solid var(--accent-color);
  font-size: 15px; /* same as .message-bubble */
  font-weight: 500;
  line-height: 1.35;
  padding: 0.65rem 0.8rem;
  width: 0;
  word-wrap: anywhere;
}
[contenteditable][placeholder]:empty:before {
  content: attr(placeholder);
  position: relative;
  padding-top: 0.1rem;
  color: gray;
  background-color: transparent;
}
.send-button {
  flex: 0;
  border-radius: 50%;
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
  margin-left: 0.5rem;
  max-width: 40px;
  max-height: 40px;
  cursor: pointer;
  transform: scale(-1, 1);
}
.reply-to-area {
  display: flex;
  flex-direction: column;
  margin-bottom: -1rem;
}
.reply-to-area-body {
  display: flex;
}
.mode-selector-container {
  display: flex;
  justify-content: center;
}
.mode-selector {
  display: flex;
}
.mode-selector-button, .mode-selector-button-selected {
  width: min(10rem, calc(50vw - 4rem));
  text-align: center;
  font-weight: bold;
  border: solid 1px var(--accent-color);
  padding: 0.3rem;
  border-radius: 0.8rem;
  user-select: none;
  cursor: pointer;
}
.mode-selector-button-selected {
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
}
.mod-name {
  padding: 0 0.5rem;
  color: var(--accent-foreground-color);
  background-color: var(--accent-color);
  border: solid 1px var(--accent-color);
  border-radius: 0.8rem;
}
.sending-text {
  text-align: center;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  opacity: 0.5;
}
.bouncing-plane {
  position: absolute;
  width: 2rem;
  height: 2rem;
  transform: translateX(0) rotate(30deg);
  animation: bounce-rotate 10s infinite;
  color: var(--accent-color);
}
@keyframes bounce-rotate {
0% {
    left: 0;
    transform: translateX(0) rotate(30deg) scaleX(1);
}
48% {
    left: calc(100% - 2rem); /* 60px = SVG width */
    transform: translateX(0) rotate(30deg) scaleX(1);
}
50% {
    left: calc(100% - 2rem);
    transform: translateX(0) rotate(-30deg) scaleX(-1);
}
98% {
    left: 0;
    transform: translateX(0) rotate(-30deg) scaleX(-1);
}
100% {
    left: 0;
    transform: translateX(0) rotate(30deg);
}
}
.tag-list {
  transition: all ease-in-out 0.25s;
  background-color: #88888833;
  border-radius: 0.8rem;
  overflow: auto;
  margin: 0.5rem;
  margin-bottom: -0.5rem;
}
.tag-member {
  cursor: pointer;
  user-select: none;
  padding: 0.5rem;
  border-bottom: solid 1px var(--accent-color);
  transition: ease-in-out 0.2s all;
  border-radius: 0.2rem;
  display: flex;
  gap: 0.5rem;
}
.tag-member:hover {
    background-color: var(--accent-color);
    color: var(--accent-foreground-color);
}
@keyframes scalePulse {
0% {
    transform: scale(1.0);
}
5% {
    transform: scaleX(0.7) scaleY(0.4);
}
10% {
    transform: scaleX(0.8) scaleY(0.6);
}
15% {
    transform: scaleX(0.7) scaleY(0.4);
}
30% {
    transform: scale(1);
}
100% {
    transform: scale(1);
}
}
.message-highlight {
  animation-name: scalePulse;
  animation-duration: 2.5s;
  animation-iteration-count: 3;
}
.person-card-image {
  width: 2rem;
  height: 2rem;
  min-width: 2rem;
  min-height: 2rem;

  border-radius: 100%;
  background-position: center;
  background-size: cover;
  background-color: var(--background-color);
  filter: drop-shadow(var(--shadow) 0rem 0rem 0.2rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}




.emoji-invoker {
  position: relative;
  top: 0.5rem;
  right: 0.2rem;
  width: 2rem;
  height: 1.5rem;
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.2s;
}
.emoji-invoker:hover {
    transform: scale(1.1);
}
.emoji-invoker > svg {
    fill: var(--accent-color);
}
.emoji-picker {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 50;
  touch-action: pan-y; /* the circle page disables touch gestures; the emoji list still needs to scroll */
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  overflow-x: hidden !important;
  font-family: Montserrat;
  border: 1px solid var(--background-color-secondary);
  width: 15rem;
  height: 20rem;
  overflow: scroll;
  padding: 1rem;
  box-sizing: border-box;
  border-radius: 0.5rem;
  background: var(--background-color);
  box-shadow: 1px 1px 8px var(--shadow);
}
.emoji-picker__search {
  display: flex;
}
.emoji-picker__search > input {
    flex: 1;
    border-radius: 10rem;
    border: 1px solid solid var(--background-color-secondary);
    padding: 0.5rem 1rem;
    outline: none;
}
.emoji-picker h5 {
  margin-bottom: 0;
  color: var(--foreground-color-secondary);
  text-transform: uppercase;
  font-size: 0.8rem;
  cursor: default;
}
.emoji-picker .emojis {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.emoji-picker .emojis:after {
    content: "";
    flex: auto;
}
.emoji-picker .emojis span {
    padding: 0.2rem;
    cursor: pointer;
    border-radius: 5px;
}
.emoji-picker .emojis span:hover {
      background: var(--background-color-secondary);
      cursor: pointer;
}
.emoji-picker__search > input {
  background-color: var(--background-color);
  color: var(--foreground-color);
  font-size: 16px; /* 16px+ keeps iOS from zooming in when the search box is tapped */
}

/* mobile: a sheet just above the message box, full width, with bigger tap targets */
@media screen and (max-width: 1000px) {
.emoji-picker {
    top: auto !important;
    left: calc(0.5rem + var(--safe-area-left)) !important;
    right: calc(0.5rem + var(--safe-area-right)) !important;
    bottom: calc(5rem + var(--safe-area-bottom)) !important;
    width: auto !important;
    height: min(20rem, 45dvh) !important;
    border-radius: 1rem;
}
.emoji-picker .emojis span {
    font-size: 1.6rem;
    padding: 0.35rem;
}
}


.ntoggle-container{
    display: flex;
    justify-content: center;
}
.ntoggle {
  width: min(10rem, calc(33vw - 2rem));
  text-align: center;
  
  border: solid 1px var(--accent-color);
  padding: 0.3rem;
  user-select: none;
  cursor: pointer;
  background-color: var(--background-color);
  color: var(--accent-color);

  transition: all ease-in-out 0.25s;
}
.ntoggle-selected {
  background-color: var(--accent-color) !important;
  color: var(--accent-foreground-color) !important;
  font-weight: bold;
}
.ntoggle-left{
    border-top-left-radius: 0.8rem;
    border-bottom-left-radius: 0.8rem;
}
.ntoggle-right {
  border-top-right-radius: 0.8rem;
  border-bottom-right-radius: 0.8rem;
}


.graph-outer[data-v-66d4e8d8] {
  display: flex;
  flex-direction: column;
  margin-bottom: 1rem;
  width: min(25rem, calc(100vw - 8rem));
  height: min(25rem, calc(100vw - 8rem));
  border-radius: 0.4rem;
  border: solid 1px #eee;
  padding: 0.5rem;
  background-color: var(--background-color);
  position: relative;
}
.graph-container[data-v-66d4e8d8]{
    position: absolute;
    height: calc(100% - 1rem);
    width: calc(100% - 1rem);
    display: flex;
    flex-direction: column;
}
.graph-container-status[data-v-66d4e8d8] {

  justify-content: center;
}
.graph-area[data-v-66d4e8d8] {
  background-color: var(--background-color);
  border-radius: 0.4rem;
  flex: 1;
  display: flex;
}
.graph-header[data-v-66d4e8d8]{
    display: flex;
}
.graph-selector-button[data-v-66d4e8d8]{
    cursor: pointer;
    padding: 0.5rem;
    border: solid 1px var(--accent-color);
    color: var(--accent-color);
    border-radius: 0.5rem;
    margin-left: 0.25rem;
    margin-right: 0.25rem;
}
.graph-selector-button[data-v-66d4e8d8]:hover, .graph-selector-button-selected[data-v-66d4e8d8] {
    background-color: var(--accent-color);
    color: var(--background-color);
}
.graph-footer[data-v-66d4e8d8]{
    display: flex;
    justify-content: space-between;
}


.background[data-v-7bacf352] {
  background-color: var(--background-color);
  color: var(--foreground-color);
  display: flex;
  flex-direction: column;
 
  height: 0;
  flex: 1;
}
.prog-rep-body[data-v-7bacf352] {
  flex: 1;
  height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: row;
  gap: 1rem;
  padding: 1rem;
}
.prog-rep-people[data-v-7bacf352]{
    width: 16rem;
    
    display: flex;
    flex-direction: column;
}
.prog-rep-people-header[data-v-7bacf352]{
    border-bottom: solid 1px var(--accent-color);
    padding-bottom: 0.5rem;
    margin-bottom: 0.5rem;
    display: flex;
}
.filter-input[data-v-7bacf352]{
    font-size: 16px;
    border: solid 1px var(--background-color-secondary);
    padding: 0.5rem;
    width: 0;
    flex: 1;
    border-radius: 0.6rem;
}
.prog-rep-people-body[data-v-7bacf352] {
    height: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    overflow-y: auto;
}
.prog-rep-people-footer[data-v-7bacf352]{
    border-top: solid 1px var(--accent-color);
    padding-top: 0.5rem;
    margin-top: 0.5rem;
    display: flex;
    justify-content: space-between;
}
.pr-member-card[data-v-7bacf352] {
  display: flex;
  flex-direction: row;
  padding: 0.5rem 1rem;
  border-radius: 0.6rem;
  box-shadow: 0 5px 60px -20px var(--shadow);
  box-shadow: 0 5px 60px -20px color-mix(in srgb, var(--accent-color) 70%, #99999900 30%);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.25);
  gap: 0.5rem;
  margin-left: 0.5rem;
  margin-right: 0.5rem;
  user-select: none;
  cursor: pointer;
}
.pr-member-card-image[data-v-7bacf352] {
  width: 3rem;
  height: 3rem;
  min-width: 3rem;
  min-height: 3rem;

  border-radius: 100%;
  background-position: center;
  background-size: cover;
  background-color: var(--background-color-secondary);
  color: var(--accent-color);
  filter: drop-shadow(var(--shadow) 0rem 0rem 0.2rem);
}
.pr-member-card-name[data-v-7bacf352]{
    font-size: 1.4rem;
    font-weight: bold;
    margin-top: auto;
    margin-bottom: auto;
}
.prog-rep-graphs[data-v-7bacf352]{
    width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2rem;
    overflow-y: auto;
}
.pr-collection[data-v-7bacf352]{
    display: flex;
    flex-direction: column;
    text-align: center;
    margin: 1rem;
    padding: 1rem;
    border-radius: 0.8rem;
    background-color: var(--background-color-secondary);
}
.pr-collection-collection[data-v-7bacf352]{
    background-color: var(--background-color);
    padding: 0.5rem;
    border-radius: 0.8rem;
    margin-left: auto;
    margin-right: auto;
}
.pr-collection-title[data-v-7bacf352]{
    font-weight: bold;
    font-size: 1.5rem;
    text-align: center;
    margin-bottom: 0.5rem;
}
.pr-collection-track-container[data-v-7bacf352] {
    border: solid 1px var(--foreground-color-secondary);
    border-radius: 0.8rem;
    padding: 1rem;
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1.5rem;
}
.pr-collection-track[data-v-7bacf352] {
  background-color: var(--background-color);
  padding: 0.5rem;
  border-radius: 0.8rem;
}
.pr-collection-track-title[data-v-7bacf352]{
    font-size: 1.5rem;
    font-weight: bold;
    margin-bottom: 0.5rem;
}
.expand-tracks-button[data-v-7bacf352] {
  cursor: pointer;
  user-select: none;
  font-size: 2rem;
  color: var(--accent-foreground-color);
  background-color: var(--accent-color);
  padding: 0.8rem;
  border-radius: 0.8rem;
  width: 10rem;
  margin-left: auto;
  margin-right: auto;
  margin-top: 1rem;
  margin-bottom: 1rem;
}
@media screen and (max-width: 1000px) {
.prog-rep-body[data-v-7bacf352]{
      flex-direction: column;
}
.prog-rep-people[data-v-7bacf352]{
      width: unset;
      height: 0;
      flex: 1;
}
.prog-rep-graphs[data-v-7bacf352] {
    width: unset;
    height: 0;
    flex: 1;
}
.pr-collection[data-v-7bacf352]{
      margin: 0;
}
.pr-collection-track-container[data-v-7bacf352]{
      margin-left: -0.5rem;
      margin-right: -0.5rem;
}
}
@media screen and (max-width: 1000px) and (orientation: landscape) {
.prog-rep-body[data-v-7bacf352] {
    flex-direction: row;
}
.prog-rep-people[data-v-7bacf352] {
    width: 0;
    height: unset;
    flex: 1;
}
.prog-rep-graphs[data-v-7bacf352] {
    width: calc(min(25rem, calc(100vw - 8rem)) + 4rem);
    height: unset;
    flex: unset;
}
}


.v--modal-box {
  border-radius: 1rem;
}


.gpe-modal-container[data-v-cc1ca2b6] {
  padding: 2rem;
  flex: 1;
  width: calc(100% - 4rem);
  height: calc(100% - 4rem);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  background-color: var(--background-color);
  color: var(--color);
}
.gpe-body[data-v-cc1ca2b6] {
  height: 0;
  flex: 1;
  overflow: auto;
  gap: 1rem;
  display: flex;
  flex-direction: column;
}
.gpe-header[data-v-cc1ca2b6] {
  font-size: 2rem;
  border-bottom: solid 1px var(--accent-color);
}
.gpe-row[data-v-cc1ca2b6] {
  display: flex;
  flex-direction: row;
  gap: 1rem;
}
.gpe-col[data-v-cc1ca2b6] {
  display: flex;
  flex-direction: column;
}
.gpe-row .gpe-col[data-v-cc1ca2b6] {
  width: 0;
  flex: 1;
}
.gpe-item[data-v-cc1ca2b6] {
  display: flex;
  flex-direction: column;
}
.gpe-row .gpe-item[data-v-cc1ca2b6] {
  width: 0;
  flex: 1;
}
.gpe-col .gpe-item[data-v-cc1ca2b6] {
  width: unset;
  flex: unset;
}
.gpe-item-label[data-v-cc1ca2b6] {
  font-size: 0.8rem;
  opacity: 0.8;
}
.gpe-item-body[data-v-cc1ca2b6] {
  display: flex;
  gap: 0.5rem;
}
.gpe-item-thumbnail[data-v-cc1ca2b6] {
  width: 7rem;
  height: 5rem;
  border: solid 1px var(--foreground-color);
  border-radius: 0.4rem;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.gpe-item-button[data-v-cc1ca2b6] {
  display: flex;
  flex-direction: column;
  justify-content: center;
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
}
.done-button[data-v-cc1ca2b6], .close-button[data-v-cc1ca2b6] {
  width: 10rem;
  text-align: center;
  font-weight: bold;
}
.done-button[data-v-cc1ca2b6] {
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
}
.color-input[data-v-cc1ca2b6] {
  border: solid 1px var(--foreground-color);
  border-radius: 0.4rem;
  height: 2.5rem;
  width: 7rem;
}
@media screen and (max-width: 1000px) {
.gpe-row[data-v-cc1ca2b6]{
        flex-direction: column;
}
.gpe-row .gpe-col[data-v-cc1ca2b6] {
        width: unset;
        flex: unset;
}
.gpe-row .gpe-item[data-v-cc1ca2b6] {
        width: unset;
        flex: unset;
}
}


.gps-container[data-v-3f962ba3]{
    display: flex;
    gap: 0.5rem;
}
.gps-select[data-v-3f962ba3]{
    flex: 1;
    width: 0;
}


.settings-container[data-v-d2e16702] {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.settings-body[data-v-d2e16702] {
  height: 0;
  flex: 1;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.settings-header[data-v-d2e16702] {
  width: min(10rem, calc(50vw - 4rem));
  text-align: center;
  font-weight: bold;
  border: solid 1px var(--accent-color);
  padding: 0.3rem;
  border-radius: 0.8rem;
  user-select: none;
  cursor: pointer;
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
  margin-left: auto;
  margin-right: auto;
}
.mod-settings[data-v-d2e16702] {
  display: flex;
  flex-direction: row;
  gap: 1rem;
  flex-wrap: wrap;
  justify-content: center;
}
.setting-action-button[data-v-d2e16702] {
  width: 5rem;
  height: 5rem;
  padding: 1rem;
  border-radius: 1rem;
  color: var(--background-color);
  background-color: var(--foreground-color);
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  user-select: none;
  cursor: pointer;
  transition: all ease-in-out 0.25s;
}
.setting-action-button[data-v-d2e16702]:hover {
    transform: scale(1.02);
}
.setting-action-button-icon[data-v-d2e16702] {
  width: 2.5rem;
  height: 2.5rem;
  margin-left: auto;
  margin-right: auto;
}
.setting-action-button-label[data-v-d2e16702] {
  font-weight: bold;
  text-align: center;
}
.notification-toggle[data-v-d2e16702] {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
.notification-toggle-label[data-v-d2e16702] {
  font-size: 0.8rem;
  opacity: 0.8;
  text-align: center;
}
.divider[data-v-d2e16702] {
  margin-top: 2rem;
  margin-bottom: 2rem;
}
.circle-edit-label[data-v-d2e16702] {
  font-weight: bold;
}
.circle-edit-section[data-v-d2e16702] {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
.modal-body[data-v-d2e16702] {
  width: min(100%, 30rem);
  height: 0;
  flex: 1;
  overflow: auto;
  margin-left: auto;
  margin-right: auto;
  margin-top: 1rem;
  margin-bottom: 1rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  flex-wrap: wrap;
  text-align: center;
  justify-content: center;
  position: relative;
}
.contact-list[data-v-d2e16702] {
  display: flex;
  flex-direction: column;
  height: 0;
  flex: 1;
  overflow: auto;
  gap: 1rem;
}
.contact-list-item[data-v-d2e16702] {
  background-color: var(--background-color-secondary);
  padding: 1rem;
  border-radius: 0.8rem;
  cursor: pointer;
  user-select: none;
}
.notification-settings-title[data-v-d2e16702] {
  text-align: center;
  font-weight: bold;
  font-size: 1.1rem;
}
.missed-settings[data-v-d2e16702] {
  text-align: center;
  opacity: 1;
  transition: ease-in-out 0.3s all;
}
.missed-settings-title[data-v-d2e16702] {
  font-weight: bold;
  font-size: 1.1rem;
}
.email-delay-input[data-v-d2e16702] {
  width: 3rem;
  border-radius: 0.8rem;
  font-size: max(0.8rem, 7pt);
  text-align: center;
}

/* mobile: bump the small labels so nothing renders below ~7pt, without changing the layout */
@media screen and (max-width: 1000px) {
.notification-toggle-label[data-v-d2e16702] {
    font-size: max(0.95rem, 7pt);
    opacity: 0.9;
}
.notification-toggle-label[data-v-d2e16702] .ntoggle,
  .notification-toggle[data-v-d2e16702] .ntoggle {
    font-size: max(1rem, 7pt);
}
.email-delay-input[data-v-d2e16702] {
    font-size: max(1rem, 7pt);
    width: 3.5rem;
}
.setting-action-button-label[data-v-d2e16702] {
    font-size: max(0.95rem, 7pt);
}
.circle-edit-section[data-v-d2e16702] {
    font-size: max(1rem, 7pt);
}
}


.modal-body[data-v-3d712796] {
  width: min(100%, 30rem);
  height: 0;
  flex: 1;
  overflow: auto;
  margin-left: auto;
  margin-right: auto;
  margin-top: 1rem;
  margin-bottom: 1rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  flex-wrap: wrap;
  text-align: center;
  justify-content: center;
  position: relative;
}
.contact-list[data-v-3d712796]{
    display: flex;
    flex-direction: column;
    height: 0;
    flex: 1;
    overflow: auto;
    gap: 1rem;
}
.contact-list-item[data-v-3d712796]{
    background-color: var(--background-color-secondary);
    padding: 1rem;
    border-radius: 0.8rem;
    cursor: pointer;
    user-select: none;
}



.people-container[data-v-61ac32b6] {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.people-header[data-v-61ac32b6] {
  width: min(10rem, calc(50vw - 4rem));
  text-align: center;
  font-weight: bold;
  border: solid 1px var(--accent-color);
  padding: 0.3rem;
  border-radius: 0.8rem;
  user-select: none;
  cursor: pointer;
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
  margin-left: auto;
  margin-right: auto;
}
.people-body[data-v-61ac32b6] {
  height: 0;
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
.tv-badge[data-v-61ac32b6] {
  position: absolute;
  bottom: 0.15rem;
  right: 0.15rem;
  width: 1.9rem;
  height: 1.9rem;
  border-radius: 100%;
  display: flex;
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
  font-size: 0.95rem;
  box-shadow: 0 2px 8px -2px var(--shadow);
  border: solid 2px var(--background-color);
  z-index: 2;
  pointer-events: auto; /* keeps the 'Joined on a TV' tooltip, even on a guest bubble that ignores clicks */
}
.tv-badge-guest[data-v-61ac32b6] {
  cursor: default; /* guests can't be opened */
}
.people-summary[data-v-61ac32b6] {
  display: flex;
  justify-content: center;
  gap: 0.4rem;
  padding: 0.5rem;
  font-size: 0.9rem;
  border-top: solid 1px var(--background-color-secondary);
  opacity: 0.85;
}
.people-summary-dot[data-v-61ac32b6] {
  opacity: 0.6;
}
.people-body-here[data-v-61ac32b6] {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 1rem;
  padding: 1rem;
  justify-content: center;
}
.people-body-not-here[data-v-61ac32b6] {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 1rem;
  padding: 1rem;
  justify-content: center;
}
.people-body-label[data-v-61ac32b6] {
  padding: 1rem;
  text-align: center;
}
.people-bubble-wrapper[data-v-61ac32b6] {
  width: 8rem;
  height: 8rem;
  position: relative;
  background: rgba(255, 255, 255, 0.15);
  background: var(--background-color-secondary);
  background: color-mix(in srgb, var(--background-color-secondary) 30%, transparent 70%);
  box-shadow: 0 5px 60px -20px var(--shadow);
  box-shadow: 0 5px 60px -20px color-mix(in srgb, var(--accent-color-secondary) 70%, #99999900 30%);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid var(--foreground-color-secondary);
  border-color: color-mix(in srgb, var(--foreground-color-secondary) 30%, #99999900 70%);
  border-radius: 50%;
  animation: bubble-move 45s infinite ease-in-out alternate;
  transition: all 0.3s ease-in-out;
  user-select: none;
  cursor: pointer;
}
.people-bubble[data-v-61ac32b6] {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  transition: all ease-in-out 0.5s;
  position: relative;
  overflow: hidden;
  border-radius: 50%;
}
.people-bubble[data-v-61ac32b6]:hover {
    opacity: 0.7;
}
.people-bubble-icon[data-v-61ac32b6] {
  display: flex;
  justify-content: center;
  height: 1rem;
  padding-top: 1rem;
  padding: 0.5rem;
  border-radius: 50%;
  background-color: var(--background-color-secondary);
  color: var(--accent-color);
}
.people-bubble-header[data-v-61ac32b6] {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 1.2rem;
  font-weight: bold;
  text-align: center;
}
.people-bubble-footer[data-v-61ac32b6] {
  text-align: center;
  padding-bottom: 1rem;
}
.person-card-image[data-v-61ac32b6] {
  width: 4rem;
  height: 4rem;
  min-width: 4rem;
  min-height: 4rem;
  margin: 0.5rem auto;
  border-radius: 100%;
  background-position: center;
  background-size: cover;
  background-color: var(--background-color);
  filter: drop-shadow(var(--shadow) 0rem 0rem 0.2rem);
}
.person-modal-header[data-v-61ac32b6] {
  text-align: center;
  font-weight: bold;
  font-size: 2rem;
  margin-top: 1rem;
  padding-bottom: 1rem;
  border-bottom: solid 1px var(--foreground-color-secondary);
}
.person-modal-body[data-v-61ac32b6] {
  height: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: auto;
  padding: 1rem;
}
.person-modal-footer[data-v-61ac32b6] {
  display: flex;
  flex-direction: row;
  justify-content: end;
  padding: 1rem;
  padding-top: 0;
}
.ptoggle-container[data-v-61ac32b6] {
  display: flex;
  justify-content: center;
}
.ptoggle[data-v-61ac32b6] {
  width: min(10rem, calc(33vw - 2rem));
  text-align: center;
  border: solid 1px var(--accent-color);
  padding: 0.3rem;
  user-select: none;
  cursor: pointer;
  background-color: var(--background-color);
  color: var(--accent-color);
  transition: all ease-in-out 0.25s;
}
.ptoggle-selected[data-v-61ac32b6] {
  background-color: var(--accent-color) !important;
  color: var(--accent-foreground-color) !important;
  font-weight: bold;
}
.ptoggle-left[data-v-61ac32b6] {
  border-top-left-radius: 0.8rem;
  border-bottom-left-radius: 0.8rem;
}
.ptoggle-right[data-v-61ac32b6] {
  border-top-right-radius: 0.8rem;
  border-bottom-right-radius: 0.8rem;
}
.person-modal-contact[data-v-61ac32b6] {
  display: flex;
  flex-direction: row;
  border-bottom: solid 1px var(--background-color-secondary);
  gap: 1rem;
  padding: 0.5rem 0;
}
.person-modal-contact-info[data-v-61ac32b6] {
  width: 0;
  flex: 1;
  display: flex;
}
.person-modal-contact-name[data-v-61ac32b6] {
  width: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 1.5rem;
}
.person-modal-contact-details[data-v-61ac32b6] {
  width: 0;
  flex: 1;
  margin-top: auto;
  margin-bottom: auto;
  justify-content: center;
  font-size: 1rem;
  display: flex;
  gap: 1rem;
}
.pmcdetails-text[data-v-61ac32b6] {
  margin-top: auto;
  margin-bottom: auto;
}
.contact-log-card[data-v-61ac32b6] {
  border: solid 1px #88888888;
  border-radius: 0.1rem;
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
  text-align: left;
  margin-left: auto;
  margin-right: auto;
  width: min(calc(100% - 1rem), 40rem);
}
.contact-log-card-header[data-v-61ac32b6] {
  font-weight: bold;
  font-size: 1.5rem;
  display: flex;
  background-color: #88888888;
  padding: 0.4rem 0.8rem;
}
.contact-log-card-notes[data-v-61ac32b6] {
  padding: 0.4rem 0.8rem;
}
.icon-button[data-v-61ac32b6]{
    position: absolute;
    bottom: 0;
    width: 1.75rem;
    height: 1.75rem;
    z-index: 10;
    background-color: var(--accent-color);
    color: var(--accent-foreground-color);
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}
.icon-button-left[data-v-61ac32b6]{
    left: 0;
}
.icon-button-right[data-v-61ac32b6]{
    right:0;
}
@media screen and (max-width: 1000px) {
.person-modal-contact-name[data-v-61ac32b6] {
    width: unset;
    flex: unset;
}
.person-modal-contact-details[data-v-61ac32b6] {
    flex: unset;
    width: unset;
    flex-direction: column;
    gap: 0.25rem;
}
.person-modal-contact-info[data-v-61ac32b6] {
    flex-direction: column;
    width: unset;
}
}


.modal-body[data-v-288d0f4f] {
  width: 100%;
  height: 0;
  flex: 1;
  overflow: auto;
  margin: 1rem 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  flex-wrap: wrap;
  text-align: center;
  justify-content: center;
  position: relative;
}
.library-card[data-v-288d0f4f] {
  width: 11rem;
  height: 11rem;
  border-radius: 100%;
}
.library-card-text[data-v-288d0f4f]{
    font-size: 1.3rem !important;
    font-weight: normal;
}
.select-circle-section[data-v-288d0f4f] {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  overflow: auto;
  height: 0;
  flex: 1;
  min-height: 13rem;
  padding: 2rem;
}
.welcome-image[data-v-288d0f4f] {
  height: 9rem;
  width: 9rem;
  margin-bottom: 1rem;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  border-radius: 50%;
  margin-left: auto;
  margin-right: auto;
}
.welcome-header-small[data-v-288d0f4f] {
  font-size: 1.2rem;
}
.welcome-header[data-v-288d0f4f] {
  font-size: 2rem;
  font-weight: bold;
}
.header[data-v-288d0f4f] {
  flex: 1;

  display: flex;
  flex-direction: column;
  justify-content: center;
}
.description[data-v-288d0f4f] {
  height: 0;
  flex: 1;
  overflow-y: auto;
}
.non-gp-icon[data-v-288d0f4f] {
  width: 5rem;
  height: 5rem;
  min-width: 5rem;
  min-height: 5rem;
  margin: auto;
  border-radius: 100%;
  background-position: center;
  background-size: cover;
  background-color: var(--background-color);
  filter: drop-shadow(var(--shadow) 0rem 0rem 0.2rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}
.non-gp-icon svg[data-v-288d0f4f] {
    width: 2.5rem;
    height: 2.5rem;
}
.people-container[data-v-288d0f4f]{
      height: 0;
      flex: 1;
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      overflow: auto;
      justify-content: center;
      align-items: center;
      gap: 1rem;
      padding: 1rem;
}
.person-card[data-v-288d0f4f]{
      display: flex;
      flex-direction: column;
      width: 10rem;
      gap: 1rem;
      background-color: var(--background-color-secondary);
      border-radius: 0.8rem;
      padding: 1rem;
      font-weight: bold;
      font-size: 1.3rem;
      user-select: none;
      cursor: pointer;
      position: relative;
}
.person-card-image[data-v-288d0f4f] {
  width: 5rem;
  height: 5rem;
  min-width: 5rem;
  min-height: 5rem;
  margin: auto;
  border-radius: 100%;
  background-position: center;
  background-size: cover;
  background-color: var(--background-color);
  filter: drop-shadow(var(--shadow) 0rem 0rem 0.2rem);
}
@media screen and (max-width: 1000px) {
.header[data-v-288d0f4f]{
        flex: unset;
        height: unset;
}
.description[data-v-288d0f4f] {
    height: unset;
    flex: unset;
    max-height: 20vh;
    overflow-y:auto;
}
.non-gp-icon[data-v-288d0f4f] {
    width: 4rem;
    height: 4rem;
    min-width: 4rem;
    min-height: 4rem;
}
.non-gp-icon svg[data-v-288d0f4f] {
      width: 2rem;
      height: 2rem;
}
}


.journey-root[data-v-278ce2f1] {
  position: relative;
  min-height: 100%;
}
.journey[data-v-278ce2f1] {
  --rail-width: 3.25rem;
  position: relative;
  max-width: 48rem;
  margin: 0 auto;
  padding: 0.75rem 0.75rem 2rem 0.75rem;
  box-sizing: border-box;
  color: var(--foreground-color);
}

/* we restore scroll position ourselves when prepending days; browser anchoring would double it */
.journey-root[data-v-278ce2f1], .journey-root *[data-v-278ce2f1] {
  overflow-anchor: none;
}

/* ---------- Scroll overlay (date pill + Now button) ---------- */
.journey__overlay[data-v-278ce2f1] {
  position: sticky;
  top: 0;
  z-index: 5;
  pointer-events: none;
}
.journey__pill[data-v-278ce2f1] {
  position: absolute;
  top: 0;
  right: 0.35rem;
  padding: 0.25rem 0.65rem;
  border-radius: 999px;
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
  font-size: 0.75rem;
  font-weight: bold;
  white-space: nowrap;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  opacity: 0;
  transition: opacity 0.3s;
  will-change: transform;
}
.journey__pill.visible[data-v-278ce2f1] {
  opacity: 1;
}
.journey__fab[data-v-278ce2f1] {
  position: absolute;
  right: 1rem;
  bottom: 1rem;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.5rem 0.9rem;
  border-radius: 999px;
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
  font-size: 0.85rem;
  font-weight: bold;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
  pointer-events: auto;
}
.journey__fab-icon[data-v-278ce2f1] {
  width: 0.9rem;
  height: 0.9rem;
}
button[data-v-278ce2f1] {
  font: inherit;
  color: inherit;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

/* ---------- Filters ---------- */
.journey__filters[data-v-278ce2f1] {
  position: sticky;
  top: 0;
  z-index: 3;
  display: flex;
  gap: 0.5rem;
  overflow-x: auto;
  /* pull up over the content's top padding so nothing peeks above the bar once stuck */
  margin-top: -0.75rem;
  padding: 0.75rem 0 0.6rem 0;
  background-color: var(--background-color);
  scrollbar-width: none;
}
.journey__filters[data-v-278ce2f1]::-webkit-scrollbar {
  display: none;
}
.journey__filter[data-v-278ce2f1] {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem 0.8rem;
  border-radius: 999px;
  background-color: var(--background-color-secondary);
  font-size: 0.9rem;
  white-space: nowrap;
}
.journey__filter.active[data-v-278ce2f1] {
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
}
.journey__filter-icon[data-v-278ce2f1] {
  width: 1rem;
  height: 1rem;
}
.journey__filter-count[data-v-278ce2f1] {
  font-size: 0.75rem;
  opacity: 0.7;
}
.journey__empty[data-v-278ce2f1],
.journey__start[data-v-278ce2f1] {
  text-align: center;
  padding: 2rem 1rem;
  opacity: 0.6;
  font-size: 0.9rem;
}
.journey__more[data-v-278ce2f1] {
  display: block;
  margin: 0.5rem auto;
  padding: 0.5rem 1rem;
  border-radius: 999px;
  color: var(--accent-color);
  font-weight: bold;
  font-size: 0.9rem;
}

/* ---------- Trail ---------- */
.journey__list[data-v-278ce2f1] {
  position: relative;
}
.journey__trail[data-v-278ce2f1] {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  overflow: visible;
  pointer-events: none;
}
.journey__trail path[data-v-278ce2f1] {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* soft worn "road" under the line */
.journey__trail-road[data-v-278ce2f1] {
  stroke: var(--foreground-color-secondary);
  stroke-opacity: 0.08;
  stroke-width: 14px;
}
.journey__trail-past[data-v-278ce2f1] {
  stroke: var(--accent-color);
  stroke-opacity: 0.7;
  stroke-width: 3.5px;
}
.journey__trail-future[data-v-278ce2f1] {
  stroke: var(--foreground-color-secondary);
  stroke-opacity: 0.5;
  stroke-width: 3px;
  stroke-dasharray: 1 8;
}
.journey__month[data-v-278ce2f1] {
  position: sticky;
  /* sits just under the sticky filter bar; height measured in updateViewport */
  top: var(--filters-height, 3rem);
  z-index: 2;
  margin: 0;
  padding: 0.6rem 0 0.4rem var(--rail-width);
  font-size: 1rem;
  font-weight: bold;
  /* leave the rail clear so the trail shows through */
  background: linear-gradient(to right, transparent var(--rail-width), var(--background-color) var(--rail-width));
}
.journey__month span[data-v-278ce2f1] {
  padding-left: 0.25rem;
}
.journey__day[data-v-278ce2f1] {
  display: flex;
  padding-bottom: 1rem;
}
.journey__rail[data-v-278ce2f1] {
  flex: none;
  width: var(--rail-width);
  display: flex;
  justify-content: center;
  position: relative;
  z-index: 1;
}
.journey__badge[data-v-278ce2f1] {
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 1;
  background-color: var(--background-color);
  border: solid 2px var(--accent-color);
  box-sizing: border-box;
}
.journey__badge-dow[data-v-278ce2f1] {
  font-size: 0.6rem;
  text-transform: uppercase;
  opacity: 0.75;
}
.journey__badge-dom[data-v-278ce2f1] {
  font-size: 1rem;
  font-weight: bold;
}
.is-future .journey__badge[data-v-278ce2f1] {
  border-style: dashed;
  border-color: var(--foreground-color-secondary);
  opacity: 0.75;
}
.is-today .journey__badge[data-v-278ce2f1] {
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
}
.journey__entries[data-v-278ce2f1] {
  flex: 1;
  min-width: 0;
  padding-left: 0.5rem;
}
.journey__day-label[data-v-278ce2f1] {
  font-size: 0.8rem;
  opacity: 0.7;
  padding: 0.2rem 0 0.4rem 0.1rem;
}
.is-future .journey__entries[data-v-278ce2f1] {
  opacity: 0.8;
}

/* ---------- Now marker ---------- */
.journey__now[data-v-278ce2f1] {
  display: flex;
  align-items: center;
  padding: 0.25rem 0 1rem 0;
}
.journey__now-dot[data-v-278ce2f1] {
  display: block;
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  background-color: var(--accent-color-secondary);
  box-shadow: 0 0 0 0 var(--accent-color-secondary);
  animation: journey-pulse-278ce2f1 1.8s ease-out infinite;
}
.journey__now-label[data-v-278ce2f1] {
  padding-left: 0.5rem;
  font-weight: bold;
  font-size: 0.85rem;
  color: var(--accent-color);
}
@keyframes journey-pulse-278ce2f1 {
0% { transform: scale(0.85); opacity: 1;
}
70% { transform: scale(1.25); opacity: 0.5;
}
100% { transform: scale(0.85); opacity: 1;
}
}
@media (prefers-reduced-motion: reduce) {
.journey__now-dot[data-v-278ce2f1] {
    animation: none;
}
}

/* ---------- Cards ---------- */
.jcard[data-v-278ce2f1] {
  display: block;
  width: 100%;
  box-sizing: border-box;
  margin-bottom: 0.5rem;
  border-radius: 0.8rem;
  background-color: var(--background-color-secondary);
  overflow: hidden;
}
.jcard__head[data-v-278ce2f1] {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  width: 100%;
  box-sizing: border-box;
  padding: 0.6rem 0.75rem;
}
.jcard__icon[data-v-278ce2f1] {
  flex: none;
  width: 2rem;
  height: 2rem;
  border-radius: 0.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--accent-color);
  background-color: var(--background-color);
}
.jcard__icon svg[data-v-278ce2f1] {
  width: 1.1rem;
  height: 1.1rem;
}
.jcard__titles[data-v-278ce2f1] {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.jcard__title[data-v-278ce2f1] {
  font-weight: bold;
  font-size: 0.95rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.jcard__sub[data-v-278ce2f1] {
  font-size: 0.78rem;
  opacity: 0.7;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.jcard__badge[data-v-278ce2f1] {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.15rem 0.5rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: bold;
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
}
.jcard__badge-icon[data-v-278ce2f1] {
  width: 0.7rem;
  height: 0.7rem;
}
.jcard__chev[data-v-278ce2f1] {
  flex: none;
  width: 0.8rem;
  height: 0.8rem;
  opacity: 0.45;
}
.jcard--milestone[data-v-278ce2f1] {
  cursor: default;
}

/* ---------- Notes ---------- */
.jnotes[data-v-278ce2f1] {
  list-style: none;
  margin: 0;
  padding: 0 0.5rem 0.4rem 0.5rem;
}
.jnote[data-v-278ce2f1] {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  width: 100%;
  box-sizing: border-box;
  padding: 0.5rem 0.4rem;
  border-top: solid 1px var(--background-color);
}
.jnote__icon[data-v-278ce2f1] {
  flex: none;
  width: 0.95rem;
  height: 0.95rem;
  margin-top: 0.15rem;
  color: var(--accent-color);
}
.jnote__body[data-v-278ce2f1] {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.jnote__text[data-v-278ce2f1] {
  font-size: 0.9rem;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  overflow-wrap: anywhere;
}
.jnote__media[data-v-278ce2f1] {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  opacity: 0.8;
}
.jnote__media svg[data-v-278ce2f1] {
  width: 1rem;
  height: 1rem;
}
.jnote__thumb[data-v-278ce2f1] {
  width: 5rem;
  height: 5rem;
  object-fit: cover;
  border-radius: 0.5rem;
  background-color: var(--background-color);
}
.jnote__link[data-v-278ce2f1] {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: var(--accent-color);
  min-width: 0;
}
.jnote__link-title[data-v-278ce2f1] {
  font-size: 0.9rem;
  font-weight: bold;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.jnote__link-host[data-v-278ce2f1] {
  font-size: 0.75rem;
  opacity: 0.75;
}
.jnote__extra[data-v-278ce2f1] {
  align-self: flex-start;
  font-size: 0.7rem;
  padding: 0.05rem 0.4rem;
  border-radius: 999px;
  background-color: var(--background-color);
  opacity: 0.8;
}
.jnote__time[data-v-278ce2f1] {
  flex: none;
  font-size: 0.72rem;
  opacity: 0.6;
  padding-top: 0.15rem;
  white-space: nowrap;
}
.jnotes__toggle[data-v-278ce2f1] {
  display: block;
  width: 100%;
  padding: 0.45rem;
  text-align: center;
  font-size: 0.82rem;
  font-weight: bold;
  color: var(--accent-color);
  border-top: solid 1px var(--background-color);
}

/* ---------- Events ---------- */
.jevent[data-v-278ce2f1] {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  width: 100%;
  box-sizing: border-box;
  padding: 0.55rem 0.75rem;
}
.jevent + .jevent[data-v-278ce2f1] {
  border-top: solid 1px var(--background-color);
}
.jevent__icon[data-v-278ce2f1] {
  flex: none;
  width: 1rem;
  height: 1rem;
  color: var(--accent-color);
}
.jevent__titles[data-v-278ce2f1] {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.jevent__name[data-v-278ce2f1] {
  font-size: 0.9rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.jevent__details[data-v-278ce2f1] {
  font-size: 0.72rem;
  opacity: 0.6;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.jevent__time[data-v-278ce2f1] {
  flex: none;
  font-size: 0.75rem;
  opacity: 0.65;
  white-space: nowrap;
}
.jevent__notes[data-v-278ce2f1] {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.1rem 0.45rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: bold;
  color: var(--accent-color);
  background-color: var(--background-color);
}
.jevent__notes-icon[data-v-278ce2f1] {
  width: 0.8rem;
  height: 0.8rem;
}
.jcard__during[data-v-278ce2f1] {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.75rem;
  color: var(--accent-color);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.jcard__during-icon[data-v-278ce2f1] {
  flex: none;
  width: 0.8rem;
  height: 0.8rem;
}
@media (hover: hover) {
.jcard__head[data-v-278ce2f1]:hover,
  .jnote[data-v-278ce2f1]:hover,
  .jevent[data-v-278ce2f1]:hover {
    background-color: color-mix(in srgb, var(--accent-color) 8%, transparent);
}
.jcard--milestone[data-v-278ce2f1]:hover {
    background-color: var(--background-color-secondary);
}
}
.jcard__head[data-v-278ce2f1]:focus-visible,
.jnote[data-v-278ce2f1]:focus-visible,
.jevent[data-v-278ce2f1]:focus-visible,
.journey__filter[data-v-278ce2f1]:focus-visible,
.journey__more[data-v-278ce2f1]:focus-visible,
.jnotes__toggle[data-v-278ce2f1]:focus-visible {
  outline: solid 2px var(--accent-color);
  outline-offset: -2px;
}
@media screen and (max-width: 500px) {
.journey[data-v-278ce2f1] {
    --rail-width: 2.75rem;
    padding-left: 0.4rem;
    padding-right: 0.4rem;
}
.journey__badge[data-v-278ce2f1] {
    width: 2.3rem;
    height: 2.3rem;
}
.journey__entries[data-v-278ce2f1] {
    padding-left: 0.35rem;
}
}


.circle-journey-view[data-v-42eb7550]{
    display: flex;
    flex-direction: column;
}
.circle-journey-view-body[data-v-42eb7550] {
  height: 0;
  flex: 1;
  display: flex;
  padding: 1rem;
  gap: 1rem;
}
.track-container[data-v-42eb7550]{
    width: 0;
    display: flex;
    flex-direction: column;
    flex: 5;
}
.track[data-v-42eb7550] {
  height: 0;
  flex: 1;
  border: solid 1px var(--accent-color);
  border-radius: 0.8rem;
  padding: var(--circle-padding);
}
.item-container[data-v-42eb7550]{
    width: 0;
    flex: 2;
    display: flex;
    flex-direction: column;
}
.circle-journey-items[data-v-42eb7550]{
    height: 0;
    flex: 1;
   
    border-radius: 0.8rem;
    padding: 1rem;
    background-color: var(--background-color-secondary);
}
.journey-notes[data-v-42eb7550] {
  flex: none;
  margin: 0.5rem 1rem 0 1rem;
  border-radius: 0.8rem;
  background-color: var(--background-color-secondary);
  display: flex;
  flex-direction: column;
  max-height: 40%;
  overflow: hidden;
}
.journey-notes-toggle[data-v-42eb7550] {
  flex: none;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  width: 100%;
  padding: 0.6rem 0.9rem;
  font: inherit;
  font-weight: bold;
  font-size: 0.9rem;
  color: inherit;
  background: none;
  border: none;
  text-align: left;
  cursor: pointer;
}
.journey-notes-toggle-icon[data-v-42eb7550] {
  width: 1.1rem;
  height: 1.1rem;
  color: var(--accent-color);
}
.journey-notes-toggle-text[data-v-42eb7550] {
  flex: 1;
}
.journey-notes-toggle-chev[data-v-42eb7550] {
  width: 0.8rem;
  height: 0.8rem;
  opacity: 0.6;
}
.journey-notes-list[data-v-42eb7550] {
  position: relative;
  min-height: 0;
  overflow-y: auto;
  padding: 0 0.6rem 0.6rem 0.6rem;
}
.journey-note[data-v-42eb7550] {
  padding: 0.5rem 0.6rem;
  border-radius: 0.6rem;
  border-top: solid 1px var(--background-color);
}
.journey-note.focused[data-v-42eb7550] {
  background-color: color-mix(in srgb, var(--accent-color) 12%, transparent);
}
.journey-note-head[data-v-42eb7550] {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.75rem;
  opacity: 0.8;
  margin-bottom: 0.25rem;
}
.journey-note-icon[data-v-42eb7550] {
  width: 0.9rem;
  height: 0.9rem;
  color: var(--accent-color);
}
.journey-note-extra[data-v-42eb7550] {
  padding: 0.05rem 0.4rem;
  border-radius: 999px;
  background-color: var(--background-color);
}
.journey-note-time[data-v-42eb7550] {
  margin-left: auto;
}
.journey-note-text[data-v-42eb7550] {
  font-size: 0.9rem;
  line-height: 1.4;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.journey-note-image[data-v-42eb7550] {
  display: block;
  max-width: 100%;
  max-height: 12rem;
  border-radius: 0.5rem;
}
.journey-note-link[data-v-42eb7550] {
  color: var(--accent-color);
  font-weight: bold;
  font-size: 0.9rem;
  overflow-wrap: anywhere;
}
.journey-note-host[data-v-42eb7550] {
  font-weight: normal;
  font-size: 0.75rem;
  opacity: 0.75;
}
@media screen and (max-width: 600px) {
.circle-journey-view-body[data-v-42eb7550] {
    padding: 0.5rem;
    gap: 0.5rem;
}
.journey-notes[data-v-42eb7550] {
    margin: 0.5rem 0.5rem 0 0.5rem;
}
}
@media screen and (max-width: 1000px) {
.circle-journey-view-body[data-v-42eb7550]{
      flex-direction: column;
}
.track-container[data-v-42eb7550]{
      width: unset;
      flex: 2;
}
.item-container[data-v-42eb7550] {
    width: unset;
    flex: 3;
}
}
@media screen and (max-width: 1000px) and (orientation: landscape) {
.circle-journey-view-body[data-v-42eb7550] {
    flex-direction: row;
}
.track-container[data-v-42eb7550] {
    width: 0;
    flex: 1;
}
.item-container[data-v-42eb7550] {
    width: 0;
    flex: 1;
}
}


.tvci-code[data-v-545d38b2] {
  display: flex;
  justify-content: center;
  gap: 0.75rem;
}
.tvci-letter[data-v-545d38b2] {
  width: 3.5rem;
  height: 4.5rem;
  padding: 0;
  font-size: 2.75rem;
  font-weight: bold;
  text-align: center;
  text-transform: uppercase;
  border-radius: 0.8rem;
  border: solid 2px var(--foreground-color-secondary);
  background-color: var(--background-color);
  color: var(--foreground-color);
  font-family: inherit;
  outline: none;
  caret-color: transparent;
  box-sizing: border-box;
  transition: border-color ease-in-out 0.15s, transform ease-in-out 0.15s;
}
.tvci-letter[data-v-545d38b2]:focus {
    border-color: var(--accent-color);
    transform: translateY(-2px);
}
.tvci-letter.large[data-v-545d38b2] {
  width: 5.5rem;
  height: 7rem;
  font-size: 4.5rem;
}
@media screen and (max-width: 1000px) {
.tvci-code[data-v-545d38b2] {
    gap: 0.5rem;
}
.tvci-letter[data-v-545d38b2] {
    width: 3rem;
    height: 4rem;
    font-size: 2.25rem;
}
.tvci-letter.large[data-v-545d38b2] {
    width: 4rem;
    height: 5.25rem;
    font-size: 3.25rem;
}
}


.tvcd-overlay[data-v-45d55de8] {
  position: fixed;
  inset: 0;
  z-index: 2000;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(1rem + var(--safe-area-top)) calc(1rem + var(--safe-area-right)) calc(1rem + var(--safe-area-bottom)) calc(1rem + var(--safe-area-left));
  box-sizing: border-box;
  touch-action: manipulation;
}
.tvcd-box[data-v-45d55de8] {
  width: min(32rem, 100%);
  max-height: 100%;
  overflow-y: auto;
  box-sizing: border-box;
  background-color: var(--background-color);
  color: var(--foreground-color);
  border-radius: 1.25rem;
  padding: 1.75rem 1.5rem 1.25rem 1.5rem;
  text-align: center;
  box-shadow: 0 20px 60px -10px rgba(0, 0, 0, 0.45);
  font-family: 'neue-haas-grotesk-display';
}
.tvcd-icon[data-v-45d55de8] {
  font-size: 3rem;
  color: var(--accent-color);
  width: 4.5rem;
  height: 4.5rem;
  margin: 0 auto 0.5rem auto;
  border-radius: 100%;
  background-color: var(--background-color-secondary);
  display: flex;
  align-items: center;
  justify-content: center;
}
.tvcd-title[data-v-45d55de8] {
  margin: 0.25rem 0 0.5rem 0;
}
.tvcd-message[data-v-45d55de8] {
  opacity: 0.85;
  margin-bottom: 1rem;
}
.tvcd-code[data-v-45d55de8] {
  margin: 1rem 0 0.5rem 0;
}
.tvcd-busy[data-v-45d55de8] {
  font-size: 3rem;
  color: var(--accent-color);
  margin: 1.25rem 0;
}
.tvcd-error[data-v-45d55de8] {
  color: #d33;
  font-weight: bold;
  margin-top: 0.5rem;
}
.tvcd-hint[data-v-45d55de8] {
  font-size: 0.85rem;
  opacity: 0.7;
  margin-top: 0.5rem;
}
.tvcd-points[data-v-45d55de8] {
  margin-top: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  text-align: left;
}
.tvcd-point[data-v-45d55de8] {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  padding: 0.65rem 0.8rem;
  border-radius: 0.8rem;
  background-color: var(--background-color-secondary);
}
.tvcd-point-icon[data-v-45d55de8] {
  flex: 0 0 auto;
  width: 2rem;
  height: 2rem;
  border-radius: 100%;
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
}
.tvcd-point-text[data-v-45d55de8] {
  font-size: 0.9rem;
  line-height: 1.35;
  flex: 1;
}
.tvcd-point-title[data-v-45d55de8] {
  font-weight: bold;
  margin-bottom: 0.1rem;
}
.tvcd-details[data-v-45d55de8] {
  font-size: 0.9rem;
  opacity: 0.8;
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: solid 1px var(--background-color-secondary);
  line-height: 1.35;
}
.tvcd-actions[data-v-45d55de8] {
  margin-top: 1.25rem;
  display: flex;
  justify-content: center;
}
.tvcd-actions .button[data-v-45d55de8] {
    min-width: 8rem;
    text-align: center;
}
.tvcd-fade-enter-active[data-v-45d55de8], .tvcd-fade-leave-active[data-v-45d55de8] {
  transition: opacity 0.2s ease-in-out;
}
.tvcd-fade-enter[data-v-45d55de8], .tvcd-fade-leave-to[data-v-45d55de8] {
  opacity: 0;
}



.background[data-v-340396e3] {
  background-color: var(--background-color);
  color: var(--foreground-color);
  display: flex;
  flex-direction: column;
  font-family: 'neue-haas-grotesk-display';
  justify-content: center;
  height: 100vh;
  width: 100vw;

  display: flex;
  flex-direction: column;
  touch-action: none;
  transform: translateZ(0);
}
.circle-body[data-v-340396e3] {
  flex: 1;
  height: calc(100% - 0.5rem);
  width: 100%;
  position: absolute;
  overflow: hidden;
}
.circle-section[data-v-340396e3] {
  position: absolute;
  box-shadow: 0 5px 60px -20px var(--shadow);
  box-shadow: 0 5px 60px -20px color-mix(in srgb, var(--accent-color) 50%, #99999900 50%);
  border-radius: 1rem;
  padding: var(--circle-section-padding);
  
  background-color: var(--background-color);
}
.circle-content[data-v-340396e3] {
  top: calc(var(--circle-padding) + var(--safe-area-top));
  left: calc(var(--circle-padding) + var(--safe-area-left));
  width: calc(60% - calc(0 * var(--circle-padding)) - calc(2 * var(--circle-section-padding)) );
  height: calc(100% - calc(2 * var(--circle-padding)) - calc(2 * var(--circle-section-padding)) - var(--safe-area-top) - var(--safe-area-bottom) );
  transition: ease-in-out all 0.4s;
}
.circle-content-full[data-v-340396e3] {
  width: calc(100% - calc(2 * var(--circle-padding)) - calc(2 * var(--circle-section-padding)) - 3rem - var(--safe-area-left) - var(--safe-area-right));
}
.circle-not-content[data-v-340396e3] {
  top: calc(var(--circle-padding) + var(--safe-area-top));
  left: calc(60% + calc(2 * var(--circle-padding)) + var(--safe-area-left));
  width: calc(40% - calc(3 * var(--circle-padding)) - calc(2 * var(--circle-section-padding)) - 3rem - var(--safe-area-left) - var(--safe-area-right));
  height: calc(100% - calc(2 * var(--circle-padding)) - calc(2 * var(--circle-section-padding)) - var(--safe-area-top) - var(--safe-area-bottom) );
}
.circle-window-wrapper[data-v-340396e3]{
    display: flex;
    flex-direction: column;
}
.circle-window-wrapee[data-v-340396e3]{
    height: 0;
    flex: 1;
}
.wrapper-button-fs[data-v-340396e3], .wrapper-button-ci[data-v-340396e3]{
    padding: 0.5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    background-color: var(--background-color-secondary);
    
    color: var(--accent-color);
    border-radius: 50%;
    position: absolute;
    
    user-select: none;
    cursor: pointer;
    z-index: 10;
    width: 2rem;
    height: 2rem;
    font-size: 1.3rem;
}
.wrapper-button-fs[data-v-340396e3] {
  bottom: -0.1rem;
  right: -0.1rem;
}
.wrapper-button-ci[data-v-340396e3] {
  top: -1rem;
  left: -1rem;
}
.window-switcher[data-v-340396e3] {
  right: var(--safe-area-right);
  top: calc(var(--circle-padding) + var(--safe-area-top));
  height: calc(100% - calc(2 * var(--circle-section-padding)) - var(--safe-area-top) - var(--safe-area-bottom) );
  position: absolute;
  box-shadow: 0 5px 60px -20px var(--shadow);
  box-shadow: 0 5px 60px -20px color-mix(in srgb, var(--accent-color) 50%, #99999900 50%);
  border-radius: 1rem;
  padding: calc(var(--circle-section-padding) / 2);
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  user-select: none;
}
.window-switcher-option[data-v-340396e3], .window-switcher-option-selected[data-v-340396e3], .window-switcher-option-notify[data-v-340396e3], .window-switcher-option-notify-shake[data-v-340396e3] {
  color: var(--accent-color);
  background-color: var(--background-color-secondary);
  user-select: none;
  cursor: pointer;
  width: 2rem;
  height: 2rem;
  border-radius: 0.5rem;
  font-size: 1.5rem;
  text-align: center;
  padding: 0.25rem;
  border: solid 3px transparent;
}
.window-switcher-option-selected[data-v-340396e3] {
  color: var(--accent-foreground-color);
  background-color: var(--accent-color);
}
.window-switcher-option-notify[data-v-340396e3] {
  position: relative;
}
.window-switcher-option-notify[data-v-340396e3]::after {
    content: "";
    position: absolute;
    top: 4px; /* adjust for padding/border as needed */
    right: 4px;
    width: 8px;
    height: 8px;
    background-color: red;
    border-radius: 50%; /* makes it a circle */
}
.window-switcher-option-notify-shake[data-v-340396e3] {
    animation-name: pulse;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}
.journey-modal-body-wrapper[data-v-340396e3] {
  height: 0;
  flex: 1;
  position: relative;
}
.journey-modal-body[data-v-340396e3] {
  position: absolute;
  height: 100%;
  width: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  background-color: var(--background-color);
  border-radius: 0.8rem;
}
.back-button[data-v-340396e3] {
  position: absolute;
  width: 5rem;
  top: 1rem;
  left: 1rem;
}
.current-date-box[data-v-340396e3] {
  position: absolute;
  z-index: 10;
  top: 0.25rem;
  right: 0.25rem;
  width: min(10rem, 100%);
  height: 2rem;
  padding: 0.3rem 0.5rem;
  text-align: center;
  overflow: hidden;
  font-weight: bold;
  font-size: 1rem;
  border-radius: 0.8rem;
  background-color: var(--background-color-secondary);
  background-color: color-mix(in srgb, var(--accent-color) 40%, transparent 60%);
  border: solid 0px var(--accent-color-secondary);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px); /* Safari */
  display: flex;
}
.current-date-box-date[data-v-340396e3] {
  width: 0;
  flex: 1;
  position: relative;
}
.current-date-box-go-to-now-button[data-v-340396e3] {
  width: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  font-weight: bold;
  background-color: var(--accent-foreground-color);
  border-radius: 0.75rem;
  color: var(--accent-color);
  cursor: pointer;
  user-select: none;
  padding: 0.5rem;
}
.current-date-box-date-month[data-v-340396e3] {
  position: absolute;
  height: 1em;
  width: 100%;
}
.tv-wait-overlay[data-v-340396e3] {
  position: fixed;
  inset: 0;
  z-index: 1500;
  background-color: color-mix(in srgb, var(--background-color) 88%, transparent 12%);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(1rem + var(--safe-area-top)) calc(1rem + var(--safe-area-right)) calc(1rem + var(--safe-area-bottom)) calc(1rem + var(--safe-area-left));
  box-sizing: border-box;
  touch-action: manipulation;
}
.tv-wait-card[data-v-340396e3] {
  width: min(34rem, 100%);
  max-height: 100%;
  overflow-y: auto;
  text-align: center;
  padding: 1.5rem;
  box-sizing: border-box;
}
.tv-wait-visual[data-v-340396e3] {
  position: relative;
  width: 9rem;
  height: 9rem;
  margin: 0 auto 1.5rem auto;
}
.tv-wait-icon[data-v-340396e3] {
  position: absolute;
  inset: 1.5rem;
  border-radius: 100%;
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
  font-size: 2.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 40px -10px color-mix(in srgb, var(--accent-color) 70%, transparent 30%);
}
.tv-wait-ring[data-v-340396e3] {
  position: absolute;
  inset: 1.5rem;
  border-radius: 100%;
  border: solid 3px var(--accent-color);
  opacity: 0;
  animation: tv-wait-ripple-340396e3 2.4s ease-out infinite;
}
.tv-wait-ring-2[data-v-340396e3] {
  animation-delay: 1.2s;
}
@keyframes tv-wait-ripple-340396e3 {
0% { transform: scale(1); opacity: 0.6;
}
100% { transform: scale(1.75); opacity: 0;
}
}
.tv-wait-title[data-v-340396e3] {
  margin: 0 0 0.5rem 0;
}
.tv-wait-text[data-v-340396e3] {
  opacity: 0.85;
  line-height: 1.4;
}
.tv-wait-dots[data-v-340396e3] {
  display: flex;
  justify-content: center;
  gap: 0.4rem;
  margin: 1.25rem 0;
}
.tv-wait-dots span[data-v-340396e3] {
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 100%;
    background-color: var(--accent-color);
    animation: tv-wait-bounce-340396e3 1.2s ease-in-out infinite;
}
.tv-wait-dots span[data-v-340396e3]:nth-child(2) { animation-delay: 0.15s;
}
.tv-wait-dots span[data-v-340396e3]:nth-child(3) { animation-delay: 0.3s;
}
@keyframes tv-wait-bounce-340396e3 {
0%, 80%, 100% { transform: translateY(0); opacity: 0.4;
}
40% { transform: translateY(-0.5rem); opacity: 1;
}
}
.tv-follow-note[data-v-340396e3] {
  font-size: 0.9rem;
  line-height: 1.35;
  opacity: 0.85;
  padding: 0.85rem 1rem;
  border-radius: 0.8rem;
  background-color: var(--background-color-secondary);
  text-align: left;
}
.tv-wait-leave[data-v-340396e3] {
  margin: 1.25rem auto 0 auto;
  width: fit-content;
  min-width: 10rem;
}
.tvw-fade-enter-active[data-v-340396e3], .tvw-fade-leave-active[data-v-340396e3] {
  transition: opacity 0.3s ease-in-out;
}
.tvw-fade-enter[data-v-340396e3], .tvw-fade-leave-to[data-v-340396e3] {
  opacity: 0;
}
.zoom-bar[data-v-340396e3] {
  z-index: 30;
  position: fixed;
  top: 0.25rem;
  left: calc(50% - 9rem);
  

  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
  height: 4rem;
  border-radius: 2rem;
  padding: 0 2rem;
  display: flex;
  flex-direction: column;
}
.zoom-bar-icons[data-v-340396e3] {
  display: flex;
  gap: 1rem;
}
.zoom-bar-icon[data-v-340396e3] {
  cursor: pointer;
  margin: auto;
  color: var(--accent-foreground-color);
  font-size: 2rem;
}
.zoom-bar-text[data-v-340396e3]{
    text-align: center;
    margin-top: -0.5rem;
    font-size: 0.8rem;
    user-select: none;
}
@media screen and (max-width: 1000px) {
.circle-content[data-v-340396e3] {
    top: calc(var(--circle-padding) + var(--safe-area-top));
    left: calc(var(--circle-padding) + var(--safe-area-left));
    width: calc(100% - calc(2 * var(--circle-padding)) - calc(2 * var(--circle-section-padding)) - var(--safe-area-left) - var(--safe-area-right) );
    height: calc(40% - calc(1 * var(--circle-padding)) - calc(2 * var(--circle-section-padding)) );
}
.circle-not-content[data-v-340396e3] {
    top: calc(40% + calc(1 * var(--circle-padding)) + var(--safe-area-top));
    left: calc(var(--circle-padding) + var(--safe-area-left));
    width: calc(100% - calc(2 * var(--circle-padding)) - calc(2 * var(--circle-section-padding)) - var(--safe-area-left) - var(--safe-area-right) );
    height: calc(60% - calc(3 * var(--circle-padding)) - calc(2 * var(--circle-section-padding)) - 4rem - var(--safe-area-bottom) - var(--safe-area-top));
}
.circle-content-full[data-v-340396e3] {
    height: calc(100% - calc(1 * var(--circle-padding)) - calc(2 * var(--circle-section-padding)) - 6rem - var(--safe-area-bottom) - var(--safe-area-top));
}
.window-switcher[data-v-340396e3] {
    right: var(--circle-padding);
    left: calc(var(--circle-padding) + var(--safe-area-left));
    top: calc(100% - 4.25rem - var(--safe-area-bottom));
    width: calc(100% - calc(2 * var(--circle-section-padding)) - var(--safe-area-left) - var(--safe-area-right));
    height: 3.5rem;
    position: absolute;
    flex-direction: row;
    overflow-x: auto;
}
.back-button[data-v-340396e3] {
    width: 1.5rem;
}
.back-button-text[data-v-340396e3] {
    display: none;
}
.wrapper-button-fs[data-v-340396e3] {
      top: unset;
    bottom: 4rem;
    right: 0.25rem;
    rotate: 90deg;
}
.wrapper-button-ci[data-v-340396e3] {
    top: -2rem;
    left: 0rem;
}
}

/* following a TV, or a circle with no content, on a phone: the content window only needs a small part of the screen,
   so give the space to chat / items / announcements */
@media screen and (max-width: 1000px) and (orientation: portrait) {
.compact-content .circle-content[data-v-340396e3]:not(.circle-content-full) {
    height: calc(24% - calc(1 * var(--circle-padding)) - calc(2 * var(--circle-section-padding)));
}
.compact-content .circle-not-content[data-v-340396e3] {
    top: calc(24% + calc(1 * var(--circle-padding)) + var(--safe-area-top));
    height: calc(76% - calc(3 * var(--circle-padding)) - calc(2 * var(--circle-section-padding)) - 4rem - var(--safe-area-bottom) - var(--safe-area-top));
}
}
@media screen and (max-width: 1000px) and (orientation: landscape) {
.circle-content[data-v-340396e3] {
    top: calc(var(--circle-padding) + var(--safe-area-top));
    left: calc(var(--circle-padding) + var(--safe-area-left));
    width: calc(50% - calc(2 * var(--circle-padding)) - calc(2 * var(--circle-section-padding)) - var(--safe-area-left));
    height: calc(100% - calc(3 * var(--circle-padding)) - calc(2 * var(--circle-section-padding)) - 4rem - var(--safe-area-bottom) - var(--safe-area-top) );
}
.circle-not-content[data-v-340396e3] {
    top: calc(var(--circle-padding) + var(--safe-area-top));
    left: calc(50% + calc(1 * var(--circle-padding)));
    width: calc(50% - calc(2 * var(--circle-padding)) - calc(2 * var(--circle-section-padding)) - var(--safe-area-right));
    height: calc(100% - calc(3 * var(--circle-padding)) - calc(2 * var(--circle-section-padding)) - 4rem - var(--safe-area-bottom) - var(--safe-area-top));
}
.circle-content-full[data-v-340396e3] {
    width: calc(100% - calc(2 * var(--circle-padding)) - calc(2 * var(--circle-section-padding)) - var(--safe-area-left) - var(--safe-area-right));
}
.wrapper-button-fs[data-v-340396e3] {
    top: unset;
    bottom: calc(4rem + var(--safe-area-bottom));
    right: 0.25rem;
    rotate: 90deg;
}
.wrapper-button-ci[data-v-340396e3] {
    left: -2rem;
    right: unset;
    top: 0rem;
}
}


.track-card[data-v-4004487f] {
  display: flex;
  gap: 0.5rem;
  position: relative;
}
.track-card-title[data-v-4004487f] {
  font-size: 1.3rem;
  width: 0;
  flex: 1;
  display: flex;
  gap: 1rem;
}
.collection-track[data-v-4004487f] {
  border: solid var(--background-color) 4px;
  border-radius: 0.8rem;
  padding: 0.5rem;
  cursor: pointer;
  user-select: none;
  background-color: var(--background-color);
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
.track-button[data-v-4004487f] {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.sort-order[data-v-4004487f]{
    position: absolute;
    top: -0.2rem;
    font-size: 0.8rem;
    left: 0.1rem;
    opacity: 0.3;
}


.collection-editor-modal-container[data-v-026f2d36] {
  padding: 2rem;
  flex: 1;
  width: calc(100% - 4rem);
  height: calc(100% - 4rem);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  background-color: var(--background-color);
  color: var(--foreground-color);
}
.collection-editor-body[data-v-026f2d36] {
  height: 0;
  flex: 1;
  overflow: auto;
  gap: 1rem;
  display: flex;
  flex-direction: column;
}
.collection-editor-header[data-v-026f2d36] {
  font-size: 2rem;
  border-bottom: solid 1px var(--accent-color);
}
.collection-editor-row[data-v-026f2d36] {
  display: flex;
  flex-direction: row;
  gap: 1rem;
}
.collection-editor-col[data-v-026f2d36] {
  display: flex;
  flex-direction: column;
}
.collection-editor-row .collection-editor-col[data-v-026f2d36] {
  width: 0;
  flex: 1;
}
.collection-editor-item[data-v-026f2d36] {
  display: flex;
  flex-direction: column;
}
.collection-editor-row .collection-editor-item[data-v-026f2d36] {
  width: 0;
  flex: 1;
}
.collection-editor-col .collection-editor-item[data-v-026f2d36] {
  width: unset;
  flex: unset;
}
.collection-editor-item-label[data-v-026f2d36] {
  font-size: 0.8rem;
  opacity: 0.8;
}
.collection-editor-item-body[data-v-026f2d36] {
  display: flex;
  gap: 0.5rem;
}
.collection-editor-item-thumbnail[data-v-026f2d36] {
  width: 7rem;
  height: 5rem;
  border: solid 1px var(--foreground-color);
  border-radius: 0.4rem;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.collection-editor-item-button[data-v-026f2d36] {
  display: flex;
  flex-direction: column;
  justify-content: center;
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
}
.done-button[data-v-026f2d36], .close-button[data-v-026f2d36] {
  width: 10rem;
  text-align: center;
  font-weight: bold;
}
.done-button[data-v-026f2d36] {
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
}
.color-input[data-v-026f2d36] {
  border: solid 1px var(--foreground-color);
  border-radius: 0.4rem;
  height: 2.5rem;
  width: 7rem;
}
.private-public-button[data-v-026f2d36], .private-public-button-selected[data-v-026f2d36] {
    border: solid 1px var(--accent-color);
    padding: 0.5rem;
    text-align: center;
    user-select: none;
    cursor: pointer;
    color: var(--accent-color);
    background-color: var(--background-color);
    border-radius: 0.5rem;
}
.private-public-button[data-v-026f2d36] {
}
.private-public-button-selected[data-v-026f2d36] {
  color: var(--accent-foreground-color);
  background-color: var(--accent-color);
}
.circle-card[data-v-026f2d36]{
    padding: 1rem;
    border-radius: 0.6rem;
    background-color: var(--background-color-secondary);
    font-size: 1.4rem;
}
.remove-icon[data-v-026f2d36]{
    user-select: none;
    cursor: pointer;
}
@media screen and (max-width: 1000px) {
.collection-editor-row[data-v-026f2d36] {
    flex-direction: column;
}
.collection-editor-row .collection-editor-col[data-v-026f2d36] {
      width: unset;
      flex: unset;
}
.collection-editor-row .collection-editor-item[data-v-026f2d36] {
      width: unset;
      flex: unset;
}
}


.track-selector[data-v-773da86c] {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.track-selector-header[data-v-773da86c]:before {
  content: ' ';
  background-color: var(--foreground-color);
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  height: 100%;
  opacity: 0.1;
  border-radius: 0.8rem;
}
.track-selector-header[data-v-773da86c] {
  position: relative;
  padding: 0.8rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.track-selector-header-group[data-v-773da86c] {
  display: flex;
  flex-direction: column;
}
.track-selector-header-group-label[data-v-773da86c] {
  font-size: 0.8rem;
}
.track-selector-body[data-v-773da86c] {
  height: 0;
  flex: 1;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.collection[data-v-773da86c] {
  border: solid var(--accent-color) 1px;
  padding: 0.8rem;
  border-radius: 0.8rem;
  color: var(--background-color);
  background-color: var(--foreground-color);
}
.collection-header[data-v-773da86c] {
  font-weight: bold;
  display: flex;
  user-select: none;
  cursor: pointer;
  font-size: 1.3rem;
  gap: 0.5rem;
  position: sticky;
  top: 0;
  background-color: var(--foreground-color);
  z-index: 1;
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.collection-header-expand-icon[data-v-773da86c] {
  width: 1.5rem;
  height: 1.5rem;
}
.collection-header-text[data-v-773da86c] {
  width: 0;
  overflow: hidden;
  flex: 1;
  border-bottom: solid var(--foreground-color) 1px;
  margin-bottom: 0.1rem;
}
.collection-body[data-v-773da86c] {
  display: flex;
  flex-direction: column;
}
.collection-track-container[data-v-773da86c] {
  height: 0;
  flex: 1;
  overflow: auto;
  padding: 1rem;
}
.section-track-container[data-v-773da86c] {
}
.collection-footer[data-v-773da86c] {
  padding-left: 2rem;
  padding-bottom: 0.5rem;
}
.add-button[data-v-773da86c] {
  color: var(--accent-foreground-color);
  background-color: var(--accent-color);
  font-weight: bold;
  display: flex;
  justify-content: center;
  text-align: center;
  gap: 0.5rem;
  margin: 0.25rem 2rem;
}
.dropdown-enter-active[data-v-773da86c], .dropdown-leave-active[data-v-773da86c] {
  transition: all .5s ease-in-out;
  transform-origin: top;
  overflow: hidden;
}
.dropdown-enter[data-v-773da86c], .dropdown-leave-to[data-v-773da86c] {
  transform: scaleY(0);
}
.section[data-v-773da86c] {
  border: solid 1px var(--foreground-color);
  border-radius: 0.6rem;
  padding: 1rem;
  background-color: var(--background-color-secondary);
  color: var(--foreground-color);
  cursor: pointer;
  position: relative;
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
.section-nameless[data-v-773da86c] {
  color: var(--foreground-color);
}
.section-sort-order[data-v-773da86c] {
  position: absolute;
  top: 0rem;
  font-size: 0.8rem;
  left: 0.25rem;
  opacity: 0.3;
}
.collection-button[data-v-773da86c] {
  margin-left: 1rem;
}


.track-selector[data-v-7c378760] {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.track-selector-header[data-v-7c378760]:before {
  content: ' ';
  background-color: var(--foreground-color);
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  height: 100%;
  opacity: 0.1;
  border-radius: 0.8rem;
}
.track-selector-header[data-v-7c378760] {
  position: relative;
  padding: 0.8rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.track-selector-header-group[data-v-7c378760] {
  display: flex;
  flex-direction: column;
}
.track-selector-header-group-label[data-v-7c378760] {
  font-size: 0.8rem;
}
.track-selector-body[data-v-7c378760] {
  height: 0;
  flex: 1;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  position: relative;
}
.collection[data-v-7c378760] {
  border: solid var(--accent-color) 1px;
  padding: 0 0.8rem;
  border-radius: 0.8rem;
  color: var(--background-color);
  background-color: var(--foreground-color);
}
.collection-body[data-v-7c378760] {
  display: flex;
  flex-direction: column;
}
.collection-track-container[data-v-7c378760] {
  height: 0;
  flex: 1;
  overflow: auto;
  padding: 1rem;
}
.section-track-container[data-v-7c378760] {
}
.collection-footer[data-v-7c378760] {
  padding-left: 2rem;
}
.add-button[data-v-7c378760] {
  color: var(--accent-foreground-color);
  background-color: var(--accent-color);
  font-weight: bold;
  display: flex;
  justify-content: center;
  text-align: center;
  gap: 0.5rem;
  margin: 0.25rem 2rem;
}
.dropdown-enter-active[data-v-7c378760], .dropdown-leave-active[data-v-7c378760] {
  transition: all .5s ease-in-out;
  transform-origin: top;
  overflow: hidden;
}
.dropdown-enter[data-v-7c378760], .dropdown-leave-to[data-v-7c378760] {
  transform: scaleY(0);
}
.section[data-v-7c378760] {
  border: solid 1px var(--foreground-color);
  border-radius: 0.6rem;
  padding: 1rem;
  background-color: var(--background-color-secondary);
  color: var(--foreground-color);
  cursor: pointer;
  position: relative
}
.section-nameless[data-v-7c378760] {
  color: var(--foreground-color);
}
.section-sort-order[data-v-7c378760] {
  position: absolute;
  top: 0rem;
  font-size: 0.8rem;
  left: 0.25rem;
  opacity: 0.3;
}
.content-button[data-v-7c378760] {
}


.v--modal-box {
  border-radius: 1rem;
}


.sectioneditor-modal-container[data-v-57203396] {
  padding: 2rem;
  flex: 1;
  width: calc(100% - 4rem);
  height: calc(100% - 4rem);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  background-color: var(--background-color);
  color: var(--color);
}
.sectioneditor-body[data-v-57203396] {
  height: 0;
  flex: 1;
  overflow: auto;
  gap: 1rem;
  display: flex;
  flex-direction: column;
}
.sectioneditor-header[data-v-57203396] {
  font-size: 2rem;
  border-bottom: solid 1px var(--accent-color);
}
.sectioneditor-row[data-v-57203396] {
  display: flex;
  flex-direction: row;
  gap: 1rem;
}
.sectioneditor-col[data-v-57203396] {
  display: flex;
  flex-direction: column;
}
.sectioneditor-row .sectioneditor-col[data-v-57203396] {
  width: 0;
  flex: 1;
}
.sectioneditor-item[data-v-57203396] {
  display: flex;
  flex-direction: column;
}
.sectioneditor-row .sectioneditor-item[data-v-57203396] {
  width: 0;
  flex: 1;
}
.sectioneditor-col .sectioneditor-item[data-v-57203396] {
  width: unset;
  flex: unset;
}
.sectioneditor-item-label[data-v-57203396] {
  font-size: 0.8rem;
  opacity: 0.8;
}
.sectioneditor-item-body[data-v-57203396] {
  display: flex;
  gap: 0.5rem;
}
.sectioneditor-item-thumbnail[data-v-57203396] {
  width: 7rem;
  height: 5rem;
  border: solid 1px var(--foreground-color);
  border-radius: 0.4rem;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.sectioneditor-item-button[data-v-57203396] {
  display: flex;
  flex-direction: column;
  justify-content: center;
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
}
.done-button[data-v-57203396], .close-button[data-v-57203396] {
  width: 10rem;
  text-align: center;
  font-weight: bold;
}
.done-button[data-v-57203396] {
  background-color: var(--accent-color);
  color: var(--accent-foreground-color);
}
.color-input[data-v-57203396] {
  border: solid 1px var(--foreground-color);
  border-radius: 0.4rem;
  height: 2.5rem;
  width: 7rem;
}
@media screen and (max-width: 1000px) {
.sectioneditor-row[data-v-57203396] {
    flex-direction: column;
}
.sectioneditor-row .sectioneditor-col[data-v-57203396] {
      width: unset;
      flex: unset;
}
.sectioneditor-row .sectioneditor-item[data-v-57203396] {
      width: unset;
      flex: unset;
}
}


.gps-container[data-v-affbf836]{
    display: flex;
    gap: 0.5rem;
}
.gps-select[data-v-affbf836]{
    flex: 1;
    width: 0;
}


.option-selection-container[data-v-24d243c4] {
  display: flex;
  flex-wrap: wrap;
  overflow: auto;
  gap: 1rem;
  justify-content: center;
}
.option-card[data-v-24d243c4] {
  width: 5rem;
  height: 3rem;
  padding: 1rem;
  border: solid 1px var(--accent-color);
  border-radius: 0.8rem;
  display: flex;
  flex-direction: column;
  cursor: pointer;
  user-select: none;
}
.option-card-logo[data-v-24d243c4] {
  flex: 1;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}
.option-card-text[data-v-24d243c4] {
  font-weight: bold;
  text-align: center;
}


.pdf-selector[data-v-49477499] {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.pdf-selector-item[data-v-49477499] {
  display: flex;
  flex-direction: column;
}
.pdf-selector-item-label[data-v-49477499] {
  font-size: 0.8rem;
}
.pdf-selector-item-selector[data-v-49477499] {
  display: flex;
  gap: 0.5rem;
}


.report-selector-container[data-v-0d2f88bc]{
    display: flex;
    flex-direction: column;
    position: relative;
}
.report-path[data-v-0d2f88bc]{
  flex: 1;
}
.report-toggle-button[data-v-0d2f88bc]{
    display: flex;
    margin-top: 1rem;
    gap: 0.25rem;
}
.report-non-param-area[data-v-0d2f88bc] {
  display: flex;
  gap: 1rem;
}
.report-param-container[data-v-0d2f88bc] {

  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
  transition: all ease-in-out 0.2s;
}
.report-param[data-v-0d2f88bc] {
  width: min(calc(33.3333% - 0.75rem), calc(100vw - 1rem));
  height: 3rem;
}


.survey-selector-container[data-v-4431b459]{
    display: flex;
    flex-direction: column;
}
.survey-selector-body[data-v-4431b459]{
    flex: 1;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    overflow: auto;
    height: 0;
    gap: 1rem;
    padding: 1rem;
    justify-content: center;
}
.survey-card[data-v-4431b459]{
  
    border: solid 1px var(--accent-color);
    width: 8rem;
    height: 8rem;
    border-radius: 0.8rem;
    user-select: none;
    cursor: pointer;
    display: flex;
    flex-direction: column;
}
.survey-card-title[data-v-4431b459]{
    font-size: 1.1rem;
    text-align: center;
    padding-bottom: 0.5rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}
.survey-card-image[data-v-4431b459]{
   flex: 1;
   background-position: center;
   background-size: cover;
   border-top-right-radius: 0.8rem;
   border-top-left-radius: 0.8rem;
}
.survey-no-results[data-v-4431b459]{
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    font-weight: bold;
    font-size: 1.3rem;
    flex: 1;
    margin-top: 1rem;
    margin-bottom: 1rem;
}
.selected-header[data-v-4431b459] {
  opacity: 0.8;
  font-style: italic;
}
.selected-body[data-v-4431b459] {
  flex: 1;
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
}
.selected-body-image[data-v-4431b459] {
  height: 4.5rem;
  width: 8rem;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 0.5rem;
  background-position: center;
}
.selected-body-title[data-v-4431b459] {
  font-weight: bold;
  flex: 1;
  margin-top: auto;
  margin-bottom: auto;
  font-size: 1.1rem;
}
.selected-body-icon[data-v-4431b459] {
  margin-top: auto;
  margin-bottom: auto;
  width: 2rem;
  height: 2rem;
  user-select: none;
  cursor: pointer;
}


.selector-body[data-v-896f6410]{
  display: flex;
  flex-direction: column;
}
.search-field[data-v-896f6410]{
}
.search-list[data-v-896f6410]{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  overflow: auto;
  height: 0;
  flex: 1;
  gap: 0.5rem;
  justify-content: center;
}
.search-result-card[data-v-896f6410] {
  width: 12rem;
  height: 11rem;
  display: flex;
  flex-direction: column;
  background-color: var(--shadow);
  padding: 1rem;
  border-radius: 0.6rem;
  cursor: pointer;
}
.search-result-card-header[data-v-896f6410]{
  height: 0;
  flex: 1;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  border-radius: 0.5rem;
}
.search-result-title[data-v-896f6410]{
  text-align: center;
  font-weight: bold;
}
.search-result-type[data-v-896f6410]{
    text-align: center;
    margin-top: 0.5rem;
}
.selected-header[data-v-896f6410]{
    opacity: 0.8;
    font-style: italic;
}
.selected-body[data-v-896f6410]{
    display: flex;
    gap: 0.5rem;
}
.selected-body-image[data-v-896f6410] {
  height: 4.5rem;
  width: 8rem;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 0.5rem;
  background-position: center;
}
.selected-body-title[data-v-896f6410]{
    font-weight: bold;
    flex: 1;
    margin-top: auto;
    margin-bottom: auto;
    font-size: 1.1rem;
}
.selected-body-icon[data-v-896f6410]{
    margin-top: auto;
    margin-bottom: auto;
    width: 2rem;
    height: 2rem;
    user-select: none;
    cursor: pointer;
}
.selected-body-result-type[data-v-896f6410]{
    font-weight: normal;
    font-size: 0.9rem;
}


.ft-selector[data-v-7076fc09] {
  display: flex;
  flex-direction: column;
  
  flex: 1;
  gap: 1rem;
}
.ft-selector-item[data-v-7076fc09] {
  display: flex;
  flex-direction: column;
  height: 0;
  flex: 1;
}
.ft-selector-item-label[data-v-7076fc09] {
  font-size: 0.8rem;
}
.ft-selector-item-selector[data-v-7076fc09] {
  display: flex;
  gap: 0.5rem;
}
.quill-ft-selector-input[data-v-7076fc09] {
  font-weight: normal;
  width: calc(100% - 1rem);
  border-bottom-left-radius: 0.4rem;
  border-bottom-right-radius: 0.4rem;
  padding: 0.5rem;
  flex: 1;

  position: relative;
}


.quill-ft-selector-input .ql-toolbar {
  position: sticky;
  top: -1rem;
  z-index: 1;
  background-color: var(--background-color);
}


.pdf-selector[data-v-265c6c47] {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.pdf-selector-item[data-v-265c6c47] {
  display: flex;
  flex-direction: column;
}
.pdf-selector-item-label[data-v-265c6c47] {
  font-size: 0.8rem;
}
.pdf-selector-item-selector[data-v-265c6c47] {
  display: flex;
  gap: 0.5rem;
}


.track-editor-container[data-v-0404eb16]{
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    overflow-y: auto;
}
.track-editor-row[data-v-0404eb16]{
    display: flex;
    flex-direction: row;
    gap: 1rem;
}
.track-editor-col[data-v-0404eb16] {
  display: flex;
  flex-direction: column;
}
.track-editor-row .track-editor-col[data-v-0404eb16] {
  width: 0;
  flex: 1;
}
.track-editor-type-item-selector[data-v-0404eb16] {
  border: solid 1px var(--accent-color);
  border-radius: 0.8rem;
  padding: 1rem;
}
.track-editor-track-container[data-v-0404eb16]{
    display: flex;
    flex: 1;
    height: 0;
    min-height: 35rem;
    gap: 1rem;
}
.track-editor-track[data-v-0404eb16] {
  width: 0;
  flex: 1;
  border: solid 1px var(--accent-color);
  border-radius: 0.8rem;
  padding: 1rem;
  min-height: 20rem;
}
.track-editor-item-attacher[data-v-0404eb16] {
  width: 0;
  flex: 1;
  border: solid 1px var(--accent-color);
  border-radius: 0.8rem;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1rem;
}
.track-editor-item-attacher-item[data-v-0404eb16]{
    flex: 1;
    height: 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.track-editor-item-attacher-times[data-v-0404eb16] {
    display: flex;
    gap: 1rem;
}
.track-editor-item-attacher-time-item[data-v-0404eb16]{
    width: 0;
    flex: 1;
}
.track-editor-item-attacher-time-item-label[data-v-0404eb16]{
    font-size: 0.8rem;
}
.track-editor-item-attacher-buttons[data-v-0404eb16] {
  display: flex;
  gap: 1rem;
}
.track-editor-item-attacher-button[data-v-0404eb16]{
    text-align: center;
    flex: 1;
    font-weight: bold;
}
.track-editor-item-attacher-item-selector[data-v-0404eb16]{
    display: flex;
    flex-wrap: wrap;
    max-height: 5rem;
    overflow: auto;
    justify-content: center;
    gap: 0.5rem;
}
.track-editor-item-attacher-body[data-v-0404eb16]{
    height: 0;
    flex: 1;
    overflow: auto;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.selector-button[data-v-0404eb16]{
    font-size: 0.9rem;
}
@media screen and (max-width: 1000px) {
.track-editor-row[data-v-0404eb16] {
    flex-direction: column;
    width: unset;
    gap: 1rem;
}
.track-editor-row .track-editor-col[data-v-0404eb16]{
        width: unset;
}
.track-editor-track-container[data-v-0404eb16]{
      height: unset;
      flex-direction: column;
}
.track-editor-track[data-v-0404eb16]{
      width: unset;
}
.track-editor-item-attacher[data-v-0404eb16]{
      width: unset;
}
.track-editor-item-attacher-times[data-v-0404eb16]{
      flex-direction: column;
}
.track-editor-item-attacher-time-item[data-v-0404eb16]{
      width: unset;
}
.track-editor-item-attacher-buttons[data-v-0404eb16] {
    flex-direction: column;
}
}


.background[data-v-5d5e3d6e] {
  flex: 1;
  display: flex;
  flex-direction: column;
  height: 100dvh;
  width: 100vw;
}
.creator-container[data-v-5d5e3d6e]{
  flex: 1;
  height: 0;
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  margin: 0.5rem;
}
.selector[data-v-5d5e3d6e] {
  width: 0;
  flex: 3;
  transition: all ease-in-out 0.5s;
}
.editor[data-v-5d5e3d6e] {
  width: 0;
  flex: 7
}
@media screen and (max-width: 1000px) {
.creator-container[data-v-5d5e3d6e]{
        flex-direction: column;
        
        height: unset;
}
.selector[data-v-5d5e3d6e]{
        width: calc(100% - 2rem);
        height: calc(100dvh - 2rem);
        flex: unset;
}
.editor[data-v-5d5e3d6e] {
    width: calc(100% - 2rem);
    flex: unset;
    height: 100vh;
}
}


@keyframes resizeSensorVisibility {
from { top: 0;
}
}

/* see https://github.com/mozilla/pdf.js/blob/55a853b6678cf3d05681ffbb521e5228e607b5d2/test/annotation_layer_test.css */
.annotationLayer {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
}
.annotationLayer section {
	position: absolute;
}
.annotationLayer .linkAnnotation > a {
	position: absolute;
	font-size: 1em;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.annotationLayer .linkAnnotation > a /* -ms-a */  {
	background: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7") 0 0 repeat;
}
.annotationLayer .linkAnnotation > a:hover {
	opacity: 0.2;
	background: #ff0;
	box-shadow: 0px 2px 10px #ff0;
}
.annotationLayer .textAnnotation img {
	position: absolute;
	cursor: pointer;
}
.annotationLayer .textWidgetAnnotation input,
.annotationLayer .textWidgetAnnotation textarea,
.annotationLayer .choiceWidgetAnnotation select,
.annotationLayer .buttonWidgetAnnotation.checkBox input,
.annotationLayer .buttonWidgetAnnotation.radioButton input {
	background-color: rgba(0, 54, 255, 0.13);
	border: 1px solid transparent;
	box-sizing: border-box;
	font-size: 9px;
	height: 100%;
	padding: 0 3px;
	vertical-align: top;
	width: 100%;
}
.annotationLayer .textWidgetAnnotation textarea {
	font: message-box;
	font-size: 9px;
	resize: none;
}
.annotationLayer .textWidgetAnnotation input[disabled],
.annotationLayer .textWidgetAnnotation textarea[disabled],
.annotationLayer .choiceWidgetAnnotation select[disabled],
.annotationLayer .buttonWidgetAnnotation.checkBox input[disabled],
.annotationLayer .buttonWidgetAnnotation.radioButton input[disabled] {
	background: none;
	border: 1px solid transparent;
	cursor: not-allowed;
}
.annotationLayer .textWidgetAnnotation input:hover,
.annotationLayer .textWidgetAnnotation textarea:hover,
.annotationLayer .choiceWidgetAnnotation select:hover,
.annotationLayer .buttonWidgetAnnotation.checkBox input:hover,
.annotationLayer .buttonWidgetAnnotation.radioButton input:hover {
	border: 1px solid #000;
}
.annotationLayer .textWidgetAnnotation input:focus,
.annotationLayer .textWidgetAnnotation textarea:focus,
.annotationLayer .choiceWidgetAnnotation select:focus {
	background: none;
	border: 1px solid transparent;
}
.annotationLayer .textWidgetAnnotation input.comb {
	font-family: monospace;
	padding-left: 2px;
	padding-right: 0;
}
.annotationLayer .textWidgetAnnotation input.comb:focus {
	/*
	 * Letter spacing is placed on the right side of each character. Hence, the
	 * letter spacing of the last character may be placed outside the visible
	 * area, causing horizontal scrolling. We avoid this by extending the width
	 * when the element has focus and revert this when it loses focus.
	 */
	width: 115%;
}
.annotationLayer .buttonWidgetAnnotation.checkBox input,
.annotationLayer .buttonWidgetAnnotation.radioButton input {
	-webkit-appearance: none;
	-moz-appearance: none;
	-ms-appearance: none;
	appearance: none;
}
.annotationLayer .popupWrapper {
	position: absolute;
	width: 20em;
}
.annotationLayer .popup {
	position: absolute;
	z-index: 200;
	max-width: 20em;
	background-color: #FFFF99;
	box-shadow: 0px 2px 5px #333;
	border-radius: 2px;
	padding: 0.6em;
	margin-left: 5px;
	cursor: pointer;
	word-wrap: break-word;
}
.annotationLayer .popup h1 {
	font-size: 1em;
	border-bottom: 1px solid #000000;
	padding-bottom: 0.2em;
}
.annotationLayer .popup p {
	padding-top: 0.2em;
}
.annotationLayer .highlightAnnotation,
.annotationLayer .underlineAnnotation,
.annotationLayer .squigglyAnnotation,
.annotationLayer .strikeoutAnnotation,
.annotationLayer .lineAnnotation svg line,
.annotationLayer .fileAttachmentAnnotation {
	cursor: pointer;
}


html{
    overflow: unset !important;
    touch-action: unset !important;
}
body {
  overflow: unset !important;
  touch-action: unset !important;
}
#app {
  overflow: unset !important;
  overscroll-behavior: unset !important;
}
.pdf-document-background {
}
.form-pdf {
  width: min(1270px, calc(100% - 2rem));
  margin: auto;
  border: solid 1px var(--accent-color);
  box-shadow: rgba(0, 0, 0, 0.4) 2px 2px;
  margin-bottom: 1rem;
  margin-bottom: 1rem;
  background-color: var(--background-color-secondary);
  pointer-events: none;
  overflow: hidden;
}
.pdf-page-slot {
  height: auto;
}



.background[data-v-2563e0b6] {
  background-color: var(--background-color);
  color: var(--foreground-color);
  display: flex;
  flex-direction: column;
  font-family: 'neue-haas-grotesk-display';
  justify-content: center;
  height: 100dvh;
  width: 100vw;
  display: flex;
  flex-direction: column;
  touch-action: none;
}
.main-body[data-v-2563e0b6] {
  flex: 1;
  height: 0;
}


.background[data-v-5fff26be] {
  background-color: var(--background-color);
  color: var(--foreground-color);
  display: flex;
  flex-direction: column;
  font-family: 'neue-haas-grotesk-display';
  justify-content: center;
  height: 100dvh;
  width: 100vw;
  display: flex;
  flex-direction: column;
  touch-action: none;
}
.main-body[data-v-5fff26be] {
  flex: 1;
  height: 0;
  display: flex;
  flex-direction: column;
  text-align: center;
  justify-content: center;
}
.code-section[data-v-5fff26be] {
  margin: 1rem 0;
}
.user-icon[data-v-5fff26be] {
  width: 5rem;
  height: 5rem;
  min-width: 5rem;
  min-height: 5rem;
  margin: auto;
  border-radius: 100%;
  background-position: center;
  background-size: cover;
  background-color: var(--background-color);
  filter: drop-shadow(var(--shadow) 0rem 0rem 0.2rem);
}
.details-title[data-v-5fff26be]{
    font-size: 3rem;
}
.details-text[data-v-5fff26be]{
    font-size: 1.1rem;
    margin-top: 1rem;
    margin-bottom: 2rem;
    max-width: min(50rem, 90vw);
    margin-left: auto;
    margin-right: auto;
}