
  .post.svelte-1bqdjxd {
    position: relative;
    display: flex;
    width: 100%;
    margin-top: 10px;
    padding-bottom: 10px;
    text-align: left;
    gap: 10px;
  }
    .moderated.svelte-1bqdjxd {
      opacity: 0.5;
      padding-top: 0px;
      padding-bottom: 0px;
    }
      .moderated.svelte-1bqdjxd .header:where(.svelte-1bqdjxd) {
        cursor: pointer;
      }
      .hidden.svelte-1bqdjxd .header:where(.svelte-1bqdjxd) {
        box-shadow: none;
        background-color: transparent;
      }

    .icon.svelte-1bqdjxd {
      width: var(--iconSize);
      overflow: hidden;
      cursor: pointer;
      position: relative;
    }
      .icon.svelte-1bqdjxd img:where(.svelte-1bqdjxd) {
        display: block;
      }
      .desktop.svelte-1bqdjxd .icon:where(.svelte-1bqdjxd) img:where(.svelte-1bqdjxd) {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        display: block;
      }
      .mobile.svelte-1bqdjxd .icon:where(.svelte-1bqdjxd) {
        border: 1px solid var(--panel);
        float: left;
        /*
        margin-top: -16px;
        margin-left: -15px;
        */
        margin-right: 15px;
        margin-bottom: 5px;
      }
      .badge.svelte-1bqdjxd {
        top: 0px;
        left: 0px;
      }

  .body.svelte-1bqdjxd {
    flex: 1;
    overflow: hidden;
  }
    .content.svelte-1bqdjxd {
      background-color: var(--block);
      overflow-wrap: anywhere;
      /* box-shadow: 2px 2px 3px #0002; */
    }
      .hidden.svelte-1bqdjxd .content:where(.svelte-1bqdjxd), .hidden.svelte-1bqdjxd .toolbar:where(.svelte-1bqdjxd), .hidden.svelte-1bqdjxd .icon:where(.svelte-1bqdjxd), .hidden.svelte-1bqdjxd .time:where(.svelte-1bqdjxd), .hidden.svelte-1bqdjxd .reply:where(.svelte-1bqdjxd) {
        display: none;
      }
    .header.svelte-1bqdjxd {
      position: relative;
      width: 100%;
      min-height: 50px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 20px;
      /*
      background-color: color-mix(in srgb, var(--block), var(--panel) 50%);
      box-shadow: 2px 2px 3px #0002;
      */
      border-bottom: 1px var(--panel) solid;
      background-color: var(--block);
      padding: 5px 15px;
      color: var(--dim);
    }
      .whispered.svelte-1bqdjxd .content:where(.svelte-1bqdjxd), .whispered.svelte-1bqdjxd .header:where(.svelte-1bqdjxd) {
        background-color: var(--whisper);
      }
      .header.svelte-1bqdjxd button:where(.svelte-1bqdjxd) {
        background: none;
        border: none;
        box-shadow: none;
        color: var(--dim);
      }
      .title.svelte-1bqdjxd {
        flex: 1;
      }
      .time.svelte-1bqdjxd {
        font-family: arial, sans-serif;
        font-size: 14px;
        opacity: 0.7;
        margin-right: 5px;
      }
      .audience.svelte-1bqdjxd {
        font-size: 15px;
        padding-left: 5px;
        color: var(--character);
      }
      .toolbar.svelte-1bqdjxd {
        display: flex;
        align-items: center;
        gap: 10px;
      }
        .delete.svelte-1bqdjxd, .edit.svelte-1bqdjxd, .moderate.svelte-1bqdjxd, .label.svelte-1bqdjxd {
          padding: 5px;
          font-size: 19px;
          cursor: pointer;
          opacity: 0.7;
        }
        .reply.svelte-1bqdjxd {
          opacity: 0.7;
        }
          .time.svelte-1bqdjxd:hover, .delete.svelte-1bqdjxd:hover, .edit.svelte-1bqdjxd:hover, .moderate.svelte-1bqdjxd:hover, .reply.svelte-1bqdjxd:hover {
            opacity: 1;
            color: var(--text);
          }
    .clear.svelte-1bqdjxd {
      clear: both;
    }

    .important.svelte-1bqdjxd .content:where(.svelte-1bqdjxd), .important.svelte-1bqdjxd .header:where(.svelte-1bqdjxd) {
      background-color: var(--prominent);
    }
    .important.svelte-1bqdjxd div.body:where(.svelte-1bqdjxd) {
      border-left: 5px solid var(--linkVisited);
    }
    .edited.svelte-1bqdjxd {
      font-size: 12px;
      color: var(--dim);
    }
    .illustration.svelte-1bqdjxd {
      object-fit: contain;
    }

  @media (max-width: 860px) {
    .post.svelte-1bqdjxd {
      gap: 0px;
    }
    .toolbar.svelte-1bqdjxd {
      gap: 5px;
    }
    .sep.svelte-1bqdjxd {
      display: none;
    }
    .header.svelte-1bqdjxd {
      display: block;
      padding: 10px 10px 5px 10px;
      padding-left: 15px;
    }
      .reaction.svelte-1bqdjxd {
        padding: 0px 5px;
      }
      .toolbar.svelte-1bqdjxd {
        width: 100%;
        display: flex;
      }
        .toolbar.svelte-1bqdjxd .time:where(.svelte-1bqdjxd) {
          flex: 1;
        }
    .content.svelte-1bqdjxd {
      padding: 15px;
    }
  }
