@import url(https://fonts.bunny.net/css?family=epilogue:400,400i,600,600i);
/*! minireset.css v0.0.6 | MIT License | github.com/jgthms/minireset.css */
html,
body,
p,
ol,
ul,
li,
dl,
dt,
dd,
blockquote,
figure,
fieldset,
legend,
textarea,
pre,
iframe,
hr,
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
}

ul {
  list-style: none;
}

button,
input,
select,
textarea {
  margin: 0;
}

html {
  box-sizing: border-box;
}

*, *::before, *::after {
  box-sizing: inherit;
}

img,
video {
  height: auto;
  max-width: 100%;
}

iframe {
  border: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}
td:not([align]),
th:not([align]) {
  text-align: inherit;
}

.field {
  position: relative;
  margin-top: 16px;
  margin-bottom: 16px;
}
.field:has(+ .sub-field) {
  margin-bottom: 0;
}

.sub-field {
  font-size: calc(0.8 * var(--text-resizable));
  margin-top: 8px;
  margin-bottom: 16px;
  text-align: right;
}

.label {
  padding: calc(var(--text-resizable) * 1.3 / var(--text-zoom-factor)) 16px;
  position: absolute;
  display: block;
  margin-bottom: 8px;
  color: rgba(0, 0, 0, 0.7);
  transition: 100ms font-size ease-in-out, 100ms padding ease-in-out;
  font-size: var(--text-resizable);
  white-space: nowrap;
  overflow: clip;
}
.label:has(+ .control input.text:focus), .label:has(+ .control input.text.not-empty), .label:has(+ .control input.password:focus), .label:has(+ .control input.password.not-empty), .label:has(+ .control input.number:focus), .label:has(+ .control input.number.not-empty), .label:has(+ .control input.date:focus), .label:has(+ .control input.date.not-empty), .label:has(+ .control input.url:focus), .label:has(+ .control input.url.not-empty), .label:has(+ .control textarea.textarea:focus), .label:has(+ .control textarea.textarea.not-empty), .label.not-empty {
  font-size: calc(0.8 * var(--text-resizable));
  padding: 8px 16px;
}

input.text,
input.url,
input.password,
input.number,
input.date {
  min-height: 56px;
  background-color: rgba(0, 0, 0, 0.05);
  border-bottom: 1px solid gray;
  border-color: gray;
  border-left: 0;
  border-right: 0;
  border-top: 0;
  box-sizing: border-box;
  color: black;
  flex: 1;
  font-size: var(--text-resizable);
  outline: none;
  padding: calc(8px + var(--text-resizable) * 0.8) 16px 6px 16px;
  width: 100%;
}
input.text:valid,
input.url:valid,
input.password:valid,
input.number:valid,
input.date:valid {
  border-color: green;
  padding-bottom: 3px;
  border-bottom-width: 4px;
}
input.text.error, input.text:invalid,
input.url.error,
input.url:invalid,
input.password.error,
input.password:invalid,
input.number.error,
input.number:invalid,
input.date.error,
input.date:invalid {
  border-color: red;
  padding-bottom: 3px;
  border-bottom-width: 4px;
}
input.text:focus,
input.url:focus,
input.password:focus,
input.number:focus,
input.date:focus {
  padding-bottom: 3px;
  border-bottom: 4px solid blue;
}

input::-webkit-date-and-time-value {
  text-align: left;
  box-sizing: border-box;
  padding: calc(8px + var(--text-resizable) * 0.8) 0 2px 8px;
  min-height: 56px;
  display: flex;
  align-items: center;
}

.select {
  background-color: rgba(0, 0, 0, 0.05);
  border: 0;
  border-bottom: 1px solid gray;
  box-sizing: inherit;
  display: inline-block;
  min-height: 56px;
  padding: calc(8px + var(--text-resizable) * 0.8) 16px 6px 16px;
  position: relative;
  vertical-align: top;
  width: 100%;
}
.select::after {
  border: 0.125em solid gray;
  border-right: 0;
  border-top: 0;
  box-sizing: inherit;
  content: " ";
  display: block;
  height: 0.625em;
  margin-top: -0.4375em;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: rotate(-45deg);
  transform-origin: center;
  transition-duration: 200ms;
  transition-property: border-color;
  width: 0.625em;
  inset-inline-end: 1.125em;
  z-index: 4;
}
.select:has(select:valid) {
  border-color: green;
  padding-bottom: 3px;
  border-bottom-width: 4px;
}
.select.error, .select:has(select:invalid) {
  border-color: red !important;
  padding-bottom: 3px;
  border-bottom-width: 4px;
}
.select:has(select:focus) {
  border-width: 4px;
  border-color: blue !important;
  padding-bottom: 3px;
}
.select select {
  align-items: center;
  appearance: none;
  border-style: solid;
  box-shadow: none;
  min-height: 56px;
  background-color: rgba(0, 0, 0, 0.05);
  border-bottom: 1px solid gray;
  border-color: gray;
  border-left: 0;
  border-right: 0;
  border-top: 0;
  box-sizing: border-box;
  color: black;
  flex: 1;
  font-size: var(--text-resizable);
  outline: none;
  padding: calc(8px + var(--text-resizable) * 0.8) 16px 6px 16px;
  width: 100%;
  background-color: transparent;
  padding: 0;
  min-height: auto;
  cursor: pointer;
  display: block;
  font-size: var(--text-resizable);
  max-width: 100%;
  outline: none;
  line-height: calc(var(--text-resizable) * 1.5);
  padding-inline-end: 2.5rem;
  padding-right: 2.5rem;
  border: 0;
}
.select select:valid {
  border-color: green;
  padding-bottom: 3px;
  border-bottom-width: 4px;
}
.select select.error, .select select:invalid {
  border-color: red;
  padding-bottom: 3px;
  border-bottom-width: 4px;
}
.select select:focus {
  padding-bottom: 3px;
  border-bottom: 4px solid blue;
}
.select select:focus {
  border: 0;
}

.control {
  display: flex;
}

.control-textarea {
  display: grid;
}
.control-textarea::after {
  content: attr(data-replicated-value) " ";
  white-space: pre-wrap;
  visibility: hidden;
  grid-area: 1/1/2/2;
  background-color: rgba(0, 0, 0, 0.05);
  border-bottom: 1px solid gray;
  border-color: gray;
  border-left: 0;
  border-right: 0;
  border-top: 0;
  box-sizing: border-box;
  color: black;
  flex: 1;
  font-size: var(--text-resizable);
  outline: none;
  padding: calc(8px + var(--text-resizable) * 0.8) 16px 6px 16px;
  width: 100%;
}
.control-textarea::after:valid {
  border-color: green;
  padding-bottom: 3px;
  border-bottom-width: 4px;
}
.control-textarea::after.error, .control-textarea::after:invalid {
  border-color: red;
  padding-bottom: 3px;
  border-bottom-width: 4px;
}
.control-textarea::after:focus {
  padding-bottom: 3px;
  border-bottom: 4px solid blue;
}

.textarea {
  resize: none;
  overflow: hidden;
  grid-area: 1/1/2/2;
  background-color: rgba(0, 0, 0, 0.05);
  border-bottom: 1px solid gray;
  border-color: gray;
  border-left: 0;
  border-right: 0;
  border-top: 0;
  box-sizing: border-box;
  color: black;
  flex: 1;
  font-size: var(--text-resizable);
  outline: none;
  padding: calc(8px + var(--text-resizable) * 0.8) 16px 6px 16px;
  width: 100%;
}
.textarea:valid {
  border-color: green;
  padding-bottom: 3px;
  border-bottom-width: 4px;
}
.textarea.error, .textarea:invalid {
  border-color: red;
  padding-bottom: 3px;
  border-bottom-width: 4px;
}
.textarea:focus {
  padding-bottom: 3px;
  border-bottom: 4px solid blue;
}

@keyframes spinAround {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
}
:root {
  --base-font-size: 16px;
  background-size: 100% 100%;
  background-position: 0px 0px, 0px 0px, 0px 0px, 0px 0px, 0px 0px;
  background-image: radial-gradient(49% 39% at 45% 47%, rgba(255, 255, 255, 0.5803921569) 0%, rgba(7, 58, 255, 0) 100%), radial-gradient(113% 91% at 17% -2%, #cb00ff 1%, rgba(255, 0, 0, 0) 99%), radial-gradient(142% 91% at 83% 7%, #00d8ff 1%, rgba(255, 0, 0, 0) 99%), radial-gradient(142% 91% at -6% 74%, #ff00c6 1%, rgba(255, 0, 0, 0) 99%), radial-gradient(142% 91% at 111% 84%, #8d00ff 0%, red 100%);
  height: 100svh;
  overflow: hidden;
}

body {
  height: 100svh;
  overflow: hidden;
}
body, body input, body button, body textarea, body input::placeholder {
  font-size: var(--base-font-size);
  font-family: "Epilogue", sans-serif;
  font-weight: normal;
  box-sizing: border-box;
  color: black;
}

fieldset, dialog {
  border: 0;
}

dialog {
  border-color: transparent;
  border-radius: 28px;
  border-style: solid;
  border-width: 2px;
  padding: 24px;
}
dialog::backdrop {
  background: linear-gradient(to right top, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.6));
}

button {
  cursor: pointer;
  padding: var(--button-padding);
}

.page.login {
  height: inherit;
}
.page.login .main {
  height: inherit;
  display: grid;
  place-content: center;
}
.page.login .login-form {
  background-color: white;
  min-width: 280px;
  max-width: 560px;
  border-radius: 28px;
  padding: 24px;
}
.page.login .login-form-title {
  margin-bottom: 16px;
  font-size: var(--text-headline);
}
.page.login .login-form-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 24px;
}
.page.login .login-form-actions .button {
  background-color: transparent;
  border: 0;
  color: blue;
  padding: 0;
  margin: 0;
  font-size: var(--text-resizable);
}
.page.login .login-form-error {
  color: red;
  margin-top: 16px;
  text-align: center;
  font-size: var(--text-resizable);
}

.page.piece .list-item.is-active {
  background-color: rgb(249, 229, 157) !important;
}
.page.piece .detail-body-content-headline {
  max-width: 390px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (min-width: 1600px) {
  .page.piece .detail-body-content-headline {
    max-width: inherit;
    margin-left: revert;
    margin-right: revert;
  }
}
@media screen and (min-width: 1600px) {
  .page.piece .markets {
    margin-top: 24px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    justify-items: center;
  }
}
.page.piece .market {
  margin: 24px auto;
  max-width: 390px;
}
@media screen and (min-width: 1600px) {
  .page.piece .market {
    margin: 0;
  }
}
.page.piece .market-publication {
  font-weight: 600;
}
.page.piece .market-publisher {
  margin-top: 4px;
  font-style: italic;
  color: var(--page-theme-supporting-text-color);
  margin-bottom: 8px;
}
.page.piece .market-publication:empty + .market-publisher {
  margin-top: 0;
  font-weight: 600;
  font-style: normal;
  color: inherit;
}
.page.piece .piece-archive-dialog {
  border-color: var(--page-theme-primary-button-color);
  max-width: 390px;
}
.page.piece .piece-archive-dialog-container {
  display: flex;
  flex-direction: column;
  font-size: var(--text-resizable);
}
.page.piece .piece-archive-dialog-container > * {
  margin: 12px 0;
}
.page.piece .piece-archive-dialog-container form {
  display: flex;
}
.page.piece .piece-archive-dialog-title {
  font-size: var(--text-headline);
}
.page.piece .piece-archive-action-button {
  border: 2px solid transparent;
  border-radius: 32px;
  background-color: rgb(200, 200, 200);
  margin: 4px 16px 4px 0;
  font-size: max(var(--text-resizable) * 0.8, var(--base-font-size));
}
.page.piece .piece-archive-action-button:focus-visible, .page.piece .piece-archive-action-button:focus {
  outline: none;
  border-color: var(--page-theme-supporting-text-color);
}
.page.piece .piece-archive-action-button-danger {
  background-color: var(--page-theme-danger-button-color);
}

.page.sub .submission-actions {
  margin-top: 16px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.page.sub .submission-error-dialog {
  border-color: var(--page-theme-primary-button-color);
  max-width: 390px;
}
.page.sub .submission-error-dialog-container {
  display: flex;
  flex-direction: column;
  font-size: var(--text-resizable);
}
.page.sub .submission-error-dialog-container > * {
  margin: 12px 0;
}
.page.sub .submission-error-dialog-title {
  font-size: var(--text-headline);
}
.page.sub .submission-actions > .button {
  margin: 8px 16px;
}
.page.sub .submission-error-action-button {
  border: 2px solid transparent;
  border-radius: 32px;
  background-color: rgb(200, 200, 200);
  margin: 4px 16px 4px 0;
  font-size: max(var(--text-resizable) * 0.8, var(--base-font-size));
}
.page.sub .submission-error-action-button:focus-visible, .page.sub .submission-error-action-button:focus {
  outline: none;
  border-color: var(--page-theme-supporting-text-color);
}

.page.with-nav {
  --active-nav-height: calc(44px + 12px * var(--text-zoom-factor));
  --nav-height: calc(44px + 12px * var(--text-zoom-factor));
  --pane-border-radius: 24px;
  display: grid;
  grid-template-areas: "app" "nav";
  grid-template-rows: 1fr var(--nav-height);
  transition: 200ms grid-template-rows ease-in-out;
  overflow: hidden;
}
@media screen and (min-width: 840px) {
  .page.with-nav {
    grid-template-areas: "nav app";
    grid-template-rows: 1fr;
    grid-template-columns: auto 1fr;
  }
}
.page.with-nav .app {
  --app-margin: 0;
  grid-area: app;
  margin: var(--app-margin) var(--app-margin) var(--app-margin) 0;
}
.page.with-nav .app.is-scrollable {
  overflow: auto;
}
@media screen and (min-width: 840px) {
  .page.with-nav .app {
    --app-margin: 16px;
  }
}
.page.with-nav .main-nav {
  background-color: var(--page-theme-background-color);
  color: var(--page-theme-text-color);
  grid-area: nav;
  min-height: 0;
  overflow: clip;
  display: flex;
  transition: 200ms transform ease-in-out;
}
@media screen and (min-width: 840px) {
  .page.with-nav .main-nav {
    display: block;
    border-radius: var(--pane-border-radius);
    height: calc(100svh - 32px);
    margin: 16px;
    padding-top: 16px;
    min-width: 96px;
  }
}
.page.with-nav.nav-hidden {
  grid-template-rows: 1fr 0px;
  --nav-height: 0px;
}
.page.with-nav .main-nav-items {
  margin: auto;
  display: flex;
  flex-grow: 1;
  justify-content: space-between;
  max-width: 600px;
  padding: 0 16px;
}
@media screen and (min-width: 600px) and (max-width: 839px) {
  .page.with-nav .main-nav-items {
    align-items: center;
  }
}
@media screen and (min-width: 840px) {
  .page.with-nav .main-nav-items {
    flex-direction: column;
  }
}
.page.with-nav .main-nav-item {
  min-width: 56px;
}
@media screen and (min-width: 840px) {
  .page.with-nav .main-nav-item:not(:first-child) {
    margin-top: 24px;
  }
}
.page.with-nav .main-nav-item.is-disabled {
  color: rgba(0, 0, 0, 0.4);
  pointer-events: none;
}
.page.with-nav .main-nav-item.is-disabled svg {
  fill: currentColor;
}
.page.with-nav .main-nav-item-content {
  align-items: center;
  color: inherit;
  display: flex;
  flex-direction: column;
  text-decoration: none;
}
.page.with-nav .main-nav-item-content:hover .main-nav-item-content-icon-highlight {
  background-color: var(--page-theme-hover-color);
  animation: 400ms ease-in-out highlight-on;
}
@media screen and (min-width: 600px) and (max-width: 839px) {
  .page.with-nav .main-nav-item-content:hover .main-nav-item-content-icon-highlight {
    background-color: transparent;
    animation: none;
  }
}
.page.with-nav .main-nav-item-content.is-active .main-nav-item-content-icon-highlight {
  background-color: var(--page-theme-highlight-color);
  animation: 400ms ease-in-out highlight-on;
}
@media screen and (min-width: 600px) and (max-width: 839px) {
  .page.with-nav .main-nav-item-content.is-active .main-nav-item-content-icon-highlight {
    background-color: transparent;
    animation: none;
  }
}
@media screen and (min-width: 600px) and (max-width: 839px) {
  .page.with-nav .main-nav-item-content {
    border-radius: 16px;
    flex-direction: row;
    padding: 4px 16px;
  }
  .page.with-nav .main-nav-item-content:has(.main-nav-item-content-icon:hover, .main-nav-item-content-text:hover) {
    background-color: var(--page-theme-hover-color);
    animation: 400ms ease-in-out highlight-on;
  }
  .page.with-nav .main-nav-item-content.is-active {
    background-color: var(--page-theme-highlight-color) !important;
    animation: 400ms ease-in-out highlight-on;
  }
  .page.with-nav .main-nav-item-content .main-nav-item-content-icon-highlight {
    padding: 0;
    margin: 0;
  }
}
.page.with-nav .main-nav-item-content-icon-highlight {
  display: block;
  padding: 4px 16px;
  border-radius: 16px;
  margin-bottom: 4px;
}
.page.with-nav .main-nav-item-content-icon {
  display: block;
  height: 24px;
  width: 24px;
}
.page.with-nav .main-nav-item-content-icon svg {
  fill: var(--page-theme-text-color);
  width: 100%;
  height: auto;
}
.page.with-nav .main-nav-item-content-text {
  font-size: calc(0.8rem * var(--text-zoom-factor));
}
@media screen and (min-width: 600px) and (max-width: 839px) {
  .page.with-nav .main-nav-item-content-text {
    padding-left: calc(4px * var(--text-zoom-factor));
  }
}
@keyframes highlight-on {
  0% {
    padding: 4px 8px;
  }
  33% {
    padding: 4px 16px;
  }
  66% {
    padding: 4px 12px;
  }
  100% {
    padding: 4px 16px;
  }
}

.app.list-detail {
  --list-heading-height: calc(56px * var(--text-zoom-factor));
  display: flex;
  flex-direction: column;
  overflow: clip;
  position: relative;
}
@media screen and (min-width: 840px) {
  .app.list-detail {
    position: relative;
    display: grid;
    grid-template-columns: min(50%, 480px) 1fr;
    column-gap: 16px;
  }
}
.app.list-detail .fab-container {
  position: absolute;
  bottom: 24px;
  right: 24px;
}
.app.list-detail .fab {
  display: block;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--page-theme-primary-fab-color);
  border: 0;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
  padding: 0;
  transition: 200ms transform ease-in-out;
  border-radius: 16px;
  width: 56px;
  height: 56px;
}
.app.list-detail .fab svg {
  width: 24px;
  height: 24px;
}
@media screen and (min-width: 600px) {
  .app.list-detail .fab {
    border-radius: 20px;
    width: 80px;
    height: 80px;
  }
  .app.list-detail .fab svg {
    width: 28px;
    height: 28px;
  }
}
@media screen and (min-width: 1200px) {
  .app.list-detail .fab {
    border-radius: 28px;
    width: 96px;
    height: 96px;
  }
  .app.list-detail .fab svg {
    width: 36px;
    height: 36px;
  }
}
.app.list-detail .fab.is-hidden {
  transform: scale(0);
}
@media screen and (min-width: 840px) {
  .app.list-detail .list-pane {
    border-radius: var(--pane-border-radius);
    overflow: clip;
    overflow-clip-margin: content-box;
    position: relative;
  }
}
.app.list-detail .detail-pane {
  display: none;
  background-color: var(--page-theme-background-color);
  position: relative;
}
@media screen and (min-width: 840px) {
  .app.list-detail .detail-pane {
    border-radius: var(--pane-border-radius);
    display: block;
    border-radius: 32px;
    overflow: clip;
    overflow-clip-margin: content-box;
  }
}
.app.list-detail .list-heading {
  background-color: var(--page-theme-background-color);
  color: var(--page-theme-text-color);
  height: var(--list-heading-height);
  display: flex;
  align-items: stretch;
}
.app.list-detail .list-heading:has(.list-heading-search, .list-heading-bar) > * {
  display: none;
}
.app.list-detail .list-heading:has(.list-heading-search, .list-heading-bar) > .list-heading-search, .app.list-detail .list-heading:has(.list-heading-search, .list-heading-bar) > .list-heading-bar {
  display: flex;
}
.app.list-detail .list-heading-search {
  flex-grow: 1;
  display: flex;
  padding: 8px 16px;
  justify-content: stretch;
}
.app.list-detail .list-heading-search-outline {
  flex-grow: 1;
  display: flex;
  padding: 8px 16px;
  justify-content: stretch;
  border-radius: 120px;
}
.app.list-detail .list-heading-search-outline:has(.list-heading-search-input:focus) {
  background-color: white;
}
.app.list-detail .list-heading-search-input {
  border: 0;
  background-color: transparent;
  flex-grow: 1;
  width: 0;
  outline: none;
  font-size: var(--text-resizable);
}
.app.list-detail .list-heading-search-input::placeholder {
  font-size: var(--text-resizable);
}
.app.list-detail .list-heading-search-action,
.app.list-detail .list-heading-bar-action {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.app.list-detail .list-heading-search-action:not(:first-child),
.app.list-detail .list-heading-bar-action:not(:first-child) {
  margin-left: 8px;
}
.app.list-detail .list-heading-search-action svg,
.app.list-detail .list-heading-bar-action svg {
  width: calc(24px * var(--text-zoom-factor));
  height: calc(24px * var(--text-zoom-factor));
}
.app.list-detail .list-heading-search-left-actions,
.app.list-detail .list-heading-search-right-actions,
.app.list-detail .list-heading-bar-left-actions,
.app.list-detail .list-heading-bar-right-actions {
  display: flex;
  align-items: center;
}
.app.list-detail .list, .app.list-detail .list-errors, .app.list-detail .list-loading {
  max-height: calc(100svh - var(--nav-height) - var(--list-heading-height));
  overflow-y: auto;
  background-color: var(--page-theme-background-color);
  transition: 200ms max-height ease-in-out;
}
@media screen and (min-width: 840px) {
  .app.list-detail .list, .app.list-detail .list-errors, .app.list-detail .list-loading {
    max-height: none;
    height: calc(100svh - var(--list-heading-height) - 2 * var(--app-margin));
  }
}
.app.list-detail .list-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}
.app.list-detail .list-loading-icon {
  height: 100px;
  width: 100px;
}
.app.list-detail .list-loading-icon svg {
  animation: spinAround 500ms infinite linear;
}
.app.list-detail .list-error {
  word-break: break-word;
  background-color: white;
  color: red;
  display: block;
  font-size: var(--text-resizable);
  margin: 0;
  padding: 16px;
}
.app.list-detail .list-empty {
  font-size: var(--text-resizable);
  padding: 12px 16px;
  font-style: italic;
}
.app.list-detail .list-item {
  display: block;
  background-color: white;
}
.app.list-detail .list-item:not(:last-child) {
  border-bottom: 1px solid var(--border-color);
}
.app.list-detail .list-item:hover {
  background-color: var(--page-theme-hover-color);
}
.app.list-detail .list-item.is-active {
  background-color: var(--page-theme-selected-color);
}
.app.list-detail .list-item-content {
  --list-detail-list-item-content-column-gap: 16px;
  display: grid;
  color: inherit;
  grid-template-areas: "media headline tags" "media description tags" "media status status";
  grid-template-columns: auto 1fr auto;
  min-height: 56px;
  padding: 12px 0;
  text-decoration: none;
  place-content: center;
}
.app.list-detail .list-item-content:hover {
  background-color: rgba(255, 255, 255, 0.4);
}
.app.list-detail .list-item-content.list-item-content-three-line {
  min-height: 80px;
}
.app.list-detail .list-item-content-status {
  grid-area: status;
  margin: 0 var(--list-detail-list-item-content-column-gap);
}
.app.list-detail .list-item-content-headline {
  grid-area: headline;
  font-size: var(--text-subhead);
  margin: 0 var(--list-detail-list-item-content-column-gap);
}
.app.list-detail .list-item-content-description {
  grid-area: description;
  font-size: var(--text-resizable);
  color: var(--page-theme-supporting-text-color);
  margin: 4px var(--list-detail-list-item-content-column-gap) 0 var(--list-detail-list-item-content-column-gap);
}
.app.list-detail .list-item-content-media {
  grid-area: media;
  margin-left: var(--list-detail-list-item-content-column-gap);
  place-self: center;
}
.app.list-detail .list-item-content-media svg {
  width: calc(24px * var(--text-zoom-factor));
  height: calc(24px * var(--text-zoom-factor));
}
.app.list-detail .list-item-content-media-text {
  font-size: var(--text-resizable);
  width: calc(var(--text-headline) + 12px);
  height: calc(var(--text-headline) + 12px);
  padding: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--page-theme-supporting-text-color);
  color: white;
  border-radius: calc(var(--text-headline) + 12px);
}
.app.list-detail .list-item-content-tags {
  grid-area: tags;
  margin-right: var(--list-detail-list-item-content-column-gap);
  place-self: start;
  font-size: calc(var(--text-resizable) * 0.7);
  color: var(--page-theme-supporting-text-color);
}
.app.list-detail .list-item-content-tags > *:not(:first-child) {
  margin-top: 8px;
}
.app.list-detail .list-heading-bar {
  flex-grow: 1;
  display: flex;
  padding: 8px 16px;
  align-items: center;
}
.app.list-detail .list-heading-bar-title {
  font-size: var(--text-headline);
  flex-grow: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 100px;
}
.app.list-detail.detail {
  --detail-heading-height: calc(56px * var(--text-zoom-factor));
}
.app.list-detail.detail .list-pane {
  position: relative;
  display: none;
}
@media screen and (min-width: 840px) {
  .app.list-detail.detail .list-pane {
    display: block;
  }
}
.app.list-detail.detail .detail-pane {
  background-color: white;
  display: block;
}
.app.list-detail.detail .detail-heading {
  display: flex;
  align-items: stretch;
  height: var(--detail-heading-height);
  padding-top: 8px 4px 0px 4px;
  border-bottom: 1px solid transparent;
  box-shadow: 0 0 rgba(0, 0, 0, 0.25);
  transition: 100ms box-shadow ease-in-out;
}
.app.list-detail.detail .detail-heading.body-scrolled {
  border-bottom-color: var(--border-color);
  box-shadow: 0 0px 8px rgba(0, 0, 0, 0.5);
}
.app.list-detail.detail .detail-heading-bar {
  flex-grow: 1;
  display: flex;
  align-items: center;
}
.app.list-detail.detail .detail-heading-bar-title {
  flex-grow: 1;
  font-size: var(--text-headline);
}
@media screen and (min-width: 840px) {
  .app.list-detail.detail .detail-heading-bar-title {
    padding-left: 16px;
  }
}
.app.list-detail.detail .detail-heading-left-actions,
.app.list-detail.detail .detail-heading-right-actions {
  display: flex;
  align-items: center;
}
.app.list-detail.detail .detail-heading-action {
  display: block;
  padding: 12px;
}
.app.list-detail.detail .detail-heading-action svg {
  width: calc(24px * var(--text-zoom-factor));
  height: calc(24px * var(--text-zoom-factor));
}
.app.list-detail.detail .detail-heading-action-button {
  border: 0;
  border-radius: 32px;
  background-color: var(--page-theme-primary-button-color);
  margin: 4px 16px 4px 0;
  font-size: max(var(--text-resizable) * 0.8, var(--base-font-size));
}
.app.list-detail.detail .detail-heading-action-button-danger {
  background-color: var(--page-theme-danger-button-color);
}
.app.list-detail.detail .detail-heading-action-close {
  display: none;
}
@media screen and (min-width: 840px) {
  .app.list-detail.detail .detail-heading-action-close {
    display: block;
  }
}
@media screen and (min-width: 840px) {
  .app.list-detail.detail .detail-heading-action-back {
    display: none;
  }
}
.app.list-detail.detail .detail-loading {
  min-height: calc(100svh - var(--nav-height) - var(--detail-heading-height));
  overflow-y: auto;
  background-color: white;
  transition: 200ms max-height ease-in-out;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (min-width: 840px) {
  .app.list-detail.detail .detail-loading {
    max-height: none;
    height: calc(100svh - var(--list-heading-height) - 2 * var(--app-margin));
  }
}
.app.list-detail.detail .detail-loading-icon {
  height: 100px;
  width: 100px;
}
.app.list-detail.detail .detail-loading-icon svg {
  animation: spinAround 500ms infinite linear;
}
.app.list-detail.detail .detail-body {
  height: calc(100svh - var(--nav-height) - var(--detail-heading-height));
  overflow-y: auto;
}
.app.list-detail.detail .detail-body-title {
  font-size: var(--text-headline);
  padding: 16px;
}
.app.list-detail.detail .detail-body-content {
  font-size: var(--text-resizable);
  padding: 16px;
}
.app.list-detail.detail .detail-body-content-details + .detail-body-content-details {
  margin-top: 16px;
}
.app.list-detail.detail .detail-body-content-headline {
  border-top: 1px solid var(--border-color);
  font-weight: 600;
  margin-top: 24px;
  padding-top: 24px;
  text-transform: uppercase;
}
.app.list-detail.detail .detail-body-content-buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
}
@media screen and (min-width: 600px) {
  .app.list-detail.detail .detail-body-content-buttons {
    flex-direction: row-reverse;
    justify-content: flex-start;
  }
}
.app.list-detail.detail .detail-body-content-buttons > .button {
  margin: 4px 8px;
}
.app.list-detail.detail .detail-body-error-messages {
  padding: 16px;
}
.app.list-detail.detail .detail-body-error-messages h2 {
  font-size: var(--text-headline);
  padding-bottom: 16px;
}
.app.list-detail.detail .detail-body-error-messages ul {
  margin-left: 16px;
  list-style: disc;
}
.app.list-detail.detail .detail-body-form-error {
  color: red;
  margin: 16px 0;
  padding: 0 16px;
  text-align: center;
  font-size: var(--text-resizable);
}
.app.list-detail.detail .weak-text {
  color: var(--page-theme-supporting-text-color);
}

.is-zoom-1-5 .list-item-content-media,
.is-zoom-2 .list-item-content-media {
  place-self: start !important;
}

.nav-hidden .app.list-detail .list {
  max-height: calc(100svh - var(--list-heading-height));
}

.card-layout {
  --card-border-radius: 12px;
  display: grid;
  align-content: start;
  justify-items: center;
  grid-template-columns: 1fr;
}

.card-pane {
  display: grid;
  align-content: start;
  justify-items: center;
  grid-template-columns: 1fr;
  gap: 8px;
  margin: 0 auto;
  overflow-y: auto;
  max-height: calc(100svh - var(--nav-height));
}
@media screen and (min-width: 600px) {
  .card-pane {
    padding-top: 8px;
  }
}
@media screen and (min-width: 840px) {
  .card-pane {
    grid-template-columns: 1fr 1fr;
    max-height: calc(100svh - 2 * var(--app-margin));
  }
}

.card {
  background-color: white;
  border-radius: var(--card-border-radius);
  display: grid;
  grid-template-areas: "media" "headline" "subhead" "description" "actions";
  grid-template-rows: minmax(0px 400px) auto auto auto auto;
  max-width: 600px;
}

.card-media {
  grid-area: media;
  max-height: 400px;
  overflow: clip;
}
.card-media img {
  border-radius: var(--card-border-radius);
}

.card-headline {
  font-size: var(--text-headline);
  margin: 24px 16px 2px 16px;
  grid-area: headline;
}

.card-subhead {
  font-size: var(--text-subhead);
  margin: 2px 16px 0 16px;
  grid-area: subhead;
}

.card-description {
  font-size: var(--text-resizable);
  margin: calc(var(--base-font-size) * 2) 16px 12px 16px;
  grid-area: description;
}

.card-actions {
  margin: 16px;
  grid-area: actions;
  text-align: right;
}

.card-action {
  border: 1px solid transparent;
  margin: 0;
  border-radius: 64px;
  background-color: var(--page-theme-primary-button-color);
  transition: 100ms background-color ease-in-out;
  -webkit-outline: none;
  outline: none;
  font-size: var(--text-resizable);
}
.card-action.card-action-danger {
  background-color: var(--page-theme-danger-button-color);
}
.card-action:not(:last-child) {
  margin-right: 8px;
}
.card-action:focus, .card-action:hover {
  background-color: rgba(196, 10, 247, 0.4);
}
.card-action:active {
  background-color: rgba(196, 10, 247, 0.55);
}
.card-action.is-outline {
  background-color: white;
  border-color: rgba(196, 10, 247, 0.25);
}
.card-action.is-outline:focus, .card-action.is-outline:hover {
  background-color: rgba(196, 10, 247, 0.1);
}
.card-action.is-outline:active {
  background-color: rgba(196, 10, 247, 0.55);
}

.nav-hidden .app.card-layout .card-pane {
  max-height: 100svh;
}

.sheet {
  position: absolute;
  background-color: white;
  overflow: hidden;
  --top-height: calc(56px * var(--text-zoom-factor));
}
.sheet.modal {
  left: 0;
  top: 0;
  width: 100vw;
  height: calc(100svh - var(--nav-height));
}
.sheet.modal.bottom {
  transform: translateY(100svh);
  transition: 200ms transform ease-in-out;
}
.sheet.modal.bottom.is-active {
  transform: translateY(0);
}
@media screen and (min-width: 840px) {
  .sheet.modal.bottom {
    width: 100%;
    height: calc(100svh - 2 * var(--app-margin));
    transform: translateY(100%);
  }
}
.sheet.modal.side {
  transform: translateX(100vw);
  transition: 200ms transform ease-in-out;
}
.sheet.modal.side.is-active {
  transform: translateX(0);
}
@media screen and (min-width: 840px) {
  .sheet.modal.side {
    width: 100%;
    height: calc(100svh - 2 * var(--app-margin));
    transform: translateX(100%);
  }
}
.sheet .sheet-top {
  display: flex;
  align-items: center;
  height: var(--top-height);
  border-bottom: 1px solid var(--border-color);
  padding: 0 16px;
}
.sheet .sheet-top.sheet-top-search {
  padding-right: 32px;
}
.sheet .sheet-headline {
  flex-grow: 1;
  font-size: var(--text-headline);
}
.sheet .sheet-dismiss {
  width: calc(24px * var(--text-zoom-factor));
  height: calc(24px * var(--text-zoom-factor));
  cursor: pointer;
}
.sheet .sheet-body {
  height: calc(100svh - var(--top-height) - var(--nav-height));
  overflow-y: auto;
  font-size: var(--text-resizable);
}
@media screen and (min-width: 840px) {
  .sheet .sheet-body {
    height: calc(100svh - var(--top-height) - 2 * var(--app-margin));
  }
}
.sheet .sheet-body-section-header {
  font-size: calc(var(--text-subhead) * 0.85);
  font-weight: 600;
  margin-bottom: 24px;
  padding: 0 16px;
  margin-top: 24px;
  text-transform: uppercase;
}
.sheet .sheet-body-section-header:not(:first-child) {
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid var(--border-color);
}
.sheet .sheet-buttons {
  padding: 0 16px;
  display: flex;
  justify-content: flex-end;
}
.sheet .field {
  margin: 12px 0;
  padding: 0 16px;
}
.sheet .checkbox-label,
.sheet .radio-label {
  display: grid;
  grid-template-columns: 40px 1fr;
  min-height: 40px;
}
.sheet .checkbox,
.sheet .radio {
  align-self: start;
  justify-self: center;
  height: 20px;
  width: 20px;
  margin-top: calc(9px - 1px * var(--text-zoom-factor));
}
.sheet .checkbox-text,
.sheet .radio-text {
  align-self: center;
}
.sheet .sheet-form-error {
  color: red;
  margin: 16px 0;
  padding: 0 16px;
  text-align: center;
}

html:has(.page.subs, .page.sub) {
  background-image: radial-gradient(49% 81% at 45% 47%, rgba(255, 226, 3, 0.2705882353) 0%, rgba(7, 58, 255, 0) 100%), radial-gradient(113% 91% at 17% -2%, #ff5a00 1%, rgba(255, 0, 0, 0) 99%), radial-gradient(142% 91% at 83% 7%, #ffdb00 1%, rgba(255, 0, 0, 0) 99%), radial-gradient(142% 91% at -6% 74%, #ff0049 1%, rgba(255, 0, 0, 0) 99%), radial-gradient(142% 91% at 111% 84%, #ff7000 0%, red 100%);
}
html:has(.page.settings) {
  background-image: radial-gradient(49% 81% at 45% 47%, rgba(192, 248, 120, 0.7411764706) 0%, rgba(7, 58, 255, 0) 100%), radial-gradient(113% 91% at 17% -2%, #2a9f25 1%, rgba(255, 0, 0, 0) 99%), radial-gradient(142% 91% at 83% 7%, #2bce60 1%, rgba(255, 0, 0, 0) 99%), radial-gradient(142% 91% at -6% 74%, #5cc222 1%, rgba(255, 0, 0, 0) 99%), radial-gradient(142% 91% at 111% 84%, #5eb62d 0%, #179f3d 100%);
}

.page {
  --base-nav-height: 56px;
  --base-nav-height-delta: 5px;
  --border-color: rgba(0 0 0 / 0.25);
  --button-padding: calc(8px * var(--text-zoom-factor)) calc(16px * var(--text-zoom-factor));
  --text-zoom-factor: 1;
  --text-headline: calc(var(--base-font-size) * var(--text-zoom-factor) * 1.5);
  --text-subhead: calc(var(--base-font-size) * var(--text-zoom-factor));
  --text-resizable: calc(var(--base-font-size) * var(--text-zoom-factor));
  --page-theme-background-color: rgb(222 222 222 / .9);
  --page-theme-text-color: rgb(0 0 0);
  --page-theme-supporting-text-color: rgb(0 0 0 / 0.5);
  --page-theme-hover-color: rgb(0 0 0 / 0.25);
  --page-theme-highlight-color: rgb(196 10 247 / 0.5);
  --page-theme-primary-button-color: rgb(222 222 222 / .9);
  --page-theme-danger-button-color: rgb(247 121 123);
  --page-theme-primary-fab-color: var(--page-theme-primary-button-color);
  --page-theme-selected-color: var(--page-theme-background-color);
  height: 100svh;
  overflow: clip;
}
.page.is-zoom-1-5 {
  --text-zoom-factor: 1.5;
}
.page.is-zoom-2 {
  --text-zoom-factor: 2;
}
.page.pieces, .page.piece {
  --page-theme-background-color: rgb(255 255 255 / 0.6);
  --page-theme-highlight-color: rgb(255 255 255 / 0.65);
  --page-theme-primary-button-color: rgb(253 153 219);
  --page-theme-primary-fab-color: rgb(183 208 247);
}
.page.settings {
  --page-theme-background-color: rgb(70 219 139 / 0.8);
  --page-theme-highlight-color: rgb(255 255 255 / 0.65);
  --page-theme-primary-button-color: rgb(106 175 144);
}
.page.subs, .page.sub {
  --page-theme-background-color: rgb(255 200 128 / 0.6);
  --page-theme-highlight-color: rgb(200 200 255 / 0.65);
  --page-theme-primary-button-color: rgb(131 246 252);
  --page-theme-selected-color: rgb(180 180 255 / 0.8);
}

@media screen and (max-width: 389px) {
  .is-hidden-subcompact {
    display: none;
  }
}

.button {
  border: 2px solid transparent;
  border-radius: 32px;
  margin: 4px 0;
  font-size: max(var(--text-resizable) * 0.8, var(--base-font-size));
  background-color: var(--page-theme-primary-button-color);
  transition: 100ms color ease-in-out;
}
.button:focus-visible, .button:focus {
  outline: none;
  border-color: var(--page-theme-supporting-text-color);
}
.button.agreed, .button.accepted {
  background-color: rgba(128, 200, 128, 0.4);
}
.button.pitch-accepted {
  background-color: rgba(128, 200, 128, 0.4);
}
.button.canceled {
  background-color: rgba(255, 0, 0, 0.4);
}
.button.considered {
  background-color: rgba(230, 230, 0, 0.4);
}
.button.contract-signed {
  background-color: rgba(0, 194, 252, 0.4);
}
.button.pitched {
  background-color: rgba(180, 180, 0, 0.4);
}
.button.published {
  background-color: rgba(252, 0, 252, 0.4);
}
.button.rejected {
  background-color: rgba(128, 128, 128, 0.4);
}
.button.rewrite-requested {
  background-color: rgba(252, 124, 0, 0.4);
}
.button.submitted {
  background-color: rgba(230, 230, 0, 0.4);
}
.button.withdrawn {
  background-color: rgba(255, 0, 0, 0.4);
}
.button[disabled], .button.disabled {
  background-color: rgba(0, 0, 0, 0.1) !important;
  pointer-events: none !important;
  color: gray !important;
  cursor: not-allowed !important;
}
.button.is-loading {
  color: transparent !important;
  pointer-events: none !important;
  display: flex;
  position: relative;
  pointer-events: none !important;
}
.button.is-loading::after {
  animation: spinAround 500ms infinite linear;
  border: 2px solid black;
  border-radius: 32px;
  border-right-color: transparent;
  border-top-color: transparent;
  content: "";
  display: block;
  height: 1em;
  left: calc(50% - 0.5em);
  position: absolute;
  width: 1em;
}

.text-centered {
  text-align: center !important;
}

.is-bold {
  font-weight: 600 !important;
}

.expired {
  color: red;
  font-weight: 600;
}

.market-event {
  align-items: center;
  border-radius: 4px;
  column-gap: 16px;
  display: grid;
  grid-template-columns: auto auto;
  padding: 4px;
}
.market-event.agreed, .market-event.accepted {
  background-color: rgba(128, 200, 128, 0.4);
}
.market-event.pitch-accepted {
  background-color: rgba(128, 200, 128, 0.4);
}
.market-event.canceled {
  background-color: rgba(255, 0, 0, 0.4);
}
.market-event.considered {
  background-color: rgba(230, 230, 0, 0.4);
}
.market-event.contract-signed {
  background-color: rgba(0, 194, 252, 0.4);
}
.market-event.pitched {
  background-color: rgba(180, 180, 0, 0.4);
}
.market-event.published {
  background-color: rgba(252, 0, 252, 0.4);
}
.market-event.rejected {
  background-color: rgba(128, 128, 128, 0.4);
}
.market-event.rewrite-requested {
  background-color: rgba(252, 124, 0, 0.4);
}
.market-event.submitted {
  background-color: rgba(230, 230, 0, 0.4);
}
.market-event.withdrawn {
  background-color: rgba(255, 0, 0, 0.4);
}

.market-event-date {
  justify-self: end;
}

.tag {
  font-size: calc(var(--text-resizable) * 0.8);
  display: inline-block;
  padding: 8px 16px;
  border-radius: 8px;
  color: black;
}
.tag.agreed, .tag.accepted {
  background-color: rgba(128, 200, 128, 0.4);
}
.tag.pitch-accepted {
  background-color: rgba(128, 200, 128, 0.4);
}
.tag.canceled {
  background-color: rgba(255, 0, 0, 0.4);
}
.tag.considered {
  background-color: rgba(230, 230, 0, 0.4);
}
.tag.contract-signed {
  background-color: rgba(0, 194, 252, 0.4);
}
.tag.pitched {
  background-color: rgba(180, 180, 0, 0.4);
}
.tag.published {
  background-color: rgba(252, 0, 252, 0.4);
}
.tag.rejected {
  background-color: rgba(128, 128, 128, 0.4);
}
.tag.rewrite-requested {
  background-color: rgba(252, 124, 0, 0.4);
}
.tag.submitted {
  background-color: rgba(230, 230, 0, 0.4);
}
.tag.withdrawn {
  background-color: rgba(255, 0, 0, 0.4);
}
.tag.is-small {
  font-size: calc(var(--text-resizable) * 0.7);
}

.control-error {
  margin-top: 8px;
  padding-left: 16px;
  font-size: calc(var(--text-resizable) * 0.9);
  color: red;
}

/*# sourceMappingURL=main-1ccca6d0c23e15bdee4ee227a08e10d0.css.map */