::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

details {
    display: block
}

[hidden], template {
    display: none
}

h1, h2, h3, p, pre {
    margin: 0
}

button {
    background-color: transparent;
    background-image: none
}

button:focus {
    outline: 1px dotted;
    outline: 5px auto -webkit-focus-ring-color
}

ul {
    margin: 0;
    padding: 0
}

ul {
    list-style: none
}

html {
    font-family: Inter, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
    line-height: 1.5
}

*, :after, :before {
    box-sizing: border-box;
    border: 0 solid #d1cec9
}

img {
    border-style: solid
}

input::-moz-placeholder {
    color: #a0aec0
}

input:-ms-input-placeholder {
    color: #a0aec0
}

input::placeholder {
    color: #a0aec0
}

[role=button], button {
    cursor: pointer
}

h1, h2, h3 {
    font-size: inherit;
    font-weight: inherit
}

a {
    color: inherit;
    text-decoration: inherit
}

button, input {
    padding: 0;
    line-height: inherit;
    color: inherit
}

code, pre {
    font-family: SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace
}

iframe, img, object, svg, video {
    display: block;
    vertical-align: middle
}

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

.media-library {
    --text-opacity: 1;
    color: #42376e;
    color: rgba(66, 55, 110, var(--text-opacity))
}

.media-library, .media-library *, .media-library-item * {
    position: relative
}

.media-library-item.gu-mirror {
    border-width: 2px;
    --border-opacity: 1;
    border-color: #a9a5bf;
    border-color: rgba(169, 165, 191, var(--border-opacity));
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04)
}

.media-library-add {
    display: flex
}

.media-library-multiple.media-library-filled .media-library-add {
    margin-top: -2px
}

.media-library-replace, .media-library-replace .media-library-dropzone, .media-library-replace .media-library-placeholder {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0
}

.media-library-multiple .media-library-items {
    border-width: 2px;
    --border-opacity: 1;
    border-color: #a9a5bf;
    border-color: rgba(169, 165, 191, var(--border-opacity))
}

.media-library-item {
    display: flex;
    align-items: center;
    min-width: 0
}

.media-library-item-row:not(:last-child) {
    border-bottom-width: 1px;
    --border-opacity: 1;
    border-color: #a9a5bf;
    border-color: rgba(169, 165, 191, var(--border-opacity))
}

.media-library-filled.media-library-sortable .media-library-add .media-library-dropzone:before {
    content: ""
}

.media-library-filled.media-library-sortable .media-library-add .media-library-dropzone:before, .media-library-row-drag {
    align-self: stretch;
    flex: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 2rem;
    --bg-opacity: 1;
    background-color: #bbb7ce;
    background-color: rgba(187, 183, 206, var(--bg-opacity));
    --bg-opacity: 0.5;
    border-right-width: 1px;
    --border-opacity: 1;
    border-color: #a9a5bf;
    border-color: rgba(169, 165, 191, var(--border-opacity));
    cursor: move;
    --text-opacity: 1;
    color: #574f85;
    color: rgba(87, 79, 133, var(--text-opacity))
}

.media-library-row-drag:hover, .media-library-row-remove {
    --text-opacity: 1;
    color: #574f85;
    color: rgba(87, 79, 133, var(--text-opacity))
}

.media-library-row-remove {
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 3rem;
    width: 3rem;
    opacity: .5;
    cursor: pointer
}

.media-library-row-remove:hover {
    opacity: 1;
    transition-property: opacity;
    transition-duration: .3s
}

.media-library-listerrors {
    border-width: 2px;
    --border-opacity: 1;
    border-color: #de9fa6;
    border-color: rgba(222, 159, 166, var(--border-opacity));
    --border-opacity: 0.5;
    --bg-opacity: 1;
    background-color: #f0d2d1;
    background-color: rgba(240, 210, 209, var(--bg-opacity));
    --bg-opacity: 0.5;
    font-size: .75rem;
    margin-bottom: -2px
}

.media-library-listerror {
    display: flex;
    align-items: flex-start
}

.media-library-listerror:not(:last-child) {
    border-bottom-width: 2px;
    --border-opacity: 1;
    border-color: #de9fa6;
    border-color: rgba(222, 159, 166, var(--border-opacity));
    --border-opacity: 0.25
}

.media-library-listerror-icon {
    align-self: stretch;
    padding-top: .75rem;
    padding-bottom: .75rem;
    margin-left: 1rem;
    margin-right: 1rem;
    width: 2rem;
    display: flex;
    justify-content: center
}

.media-library-filled.media-library-sortable .media-library-listerror-icon {
    margin-left: 0;
    margin-right: 1rem;
    --bg-opacity: 1;
    background-color: #f0d2d1;
    background-color: rgba(240, 210, 209, var(--bg-opacity));
    --bg-opacity: 0.5;
    border-right-width: 1px;
    --border-opacity: 1;
    border-color: #f0d2d1;
    border-color: rgba(240, 210, 209, var(--border-opacity))
}

.media-library-listerror-content {
    flex-grow: 1;
    padding-right: 3rem
}

.media-library-listerror-title {
    --text-opacity: 1;
    color: #a93147;
    color: rgba(169, 49, 71, var(--text-opacity));
    height: 3rem;
    display: flex;
    align-items: center
}

.media-library-listerror-items {
    margin-top: -.5rem;
    border-top-width: 1px;
    --border-opacity: 1;
    border-color: #de9fa6;
    border-color: rgba(222, 159, 166, var(--border-opacity));
    --border-opacity: 0.25
}

.media-library-listerror-item {
    display: flex;
    align-items: center;
    padding-top: .75rem;
    padding-bottom: .75rem
}

.media-library-listerror-thumb {
    flex: none;
    width: 1.5rem;
    height: 1.5rem;
    margin-right: .75rem
}

.media-library-listerror-thumb:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-width: 1px;
    --border-opacity: 1;
    border-color: #a93147;
    border-color: rgba(169, 49, 71, var(--border-opacity));
    --border-opacity: 0.5
}

.media-library-listerror-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.media-library-thumb {
    position: relative;
    flex: none;
    width: 4rem;
    height: 4rem;
    margin: 1rem
}

.media-library-single .media-library-thumb {
    margin: 0 1rem 0 0
}

.media-library-thumb-img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    overflow: hidden
}

.media-library-thumb-extension {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    --bg-opacity: 1;
    background-color: #fff;
    background-color: rgba(255, 255, 255, var(--bg-opacity))
}

.media-library-thumb-extension-truncate {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 600;
    text-transform: uppercase;
    --text-opacity: 1;
    color: #574f85;
    color: rgba(87, 79, 133, var(--text-opacity));
    font-size: .75rem
}

.media-library-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 4rem;
    height: calc(4rem - 4px)
}

.media-library-filled.media-library-sortable .media-library-add .media-library-placeholder {
    width: 2rem;
    height: 2rem;
    margin-left: -2rem;
    margin-right: 1rem
}

.media-library-multiple.media-library-empty .media-library-add .media-library-placeholder:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 2.5rem;
    height: 2.5rem;
    --bg-opacity: 1;
    background-color: #9a97af;
    background-color: rgba(154, 151, 175, var(--bg-opacity));
    --bg-opacity: 0.5;
    --border-opacity: 1;
    border-color: #9a97af;
    border-color: rgba(154, 151, 175, var(--border-opacity));
    --border-opacity: 0.5;
    transform: translate(calc(-50% + 4px), calc(-50% - 1px)) rotate(5deg)
}

.media-library-multiple.media-library-empty .media-library-add .media-library-placeholder:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 2.5rem;
    height: 2.5rem;
    --bg-opacity: 1;
    background-color: #bbb7ce;
    background-color: rgba(187, 183, 206, var(--bg-opacity));
    --border-opacity: 1;
    border-color: #9a97af;
    border-color: rgba(154, 151, 175, var(--border-opacity));
    --border-opacity: 0.5;
    transform: translate(-50%, -50%)
}

.media-library-dropzone-drop .media-library-placeholder, .media-library-dropzone:not(:disabled):active .media-library-placeholder {
    transform: translateY(1px)
}

.media-library-help {
    font-size: 14px;
    --text-opacity: 1;
    color: #514982;
    color: rgba(81, 73, 130, var(--text-opacity))
}

.media-library-help-clear {
    padding-left: .5rem;
    padding-right: .5rem;
    opacity: .75;
    cursor: pointer
}

.media-library-help-clear:hover {
    opacity: 1;
    transition-property: opacity;
    transition-duration: .3s
}

.media-library-dropzone {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    display: flex;
    align-items: center;
    border-width: 2px;
    --border-opacity: 1;
    border-color: #514982;
    border-color: rgba(81, 73, 130, var(--border-opacity));
    --border-opacity: 0.25;
    transition-property: background-color, border-color, color, fill, stroke;
    transition-duration: .3s;
    flex-grow: 1
}

.media-library-dropzone-add {
    border-style: dashed;
    --bg-opacity: 1;
    background-color: #eae8f4;
    background-color: rgba(234, 232, 244, var(--bg-opacity));
    /*border-radius: 6px;*/
}

.media-library-dropzone-replace {
    border-style: solid
}

.media-library-dropzone-drag, .media-library-dropzone:not(:disabled):hover {
    --bg-opacity: 1;
    background-color: #bbb7ce;
    background-color: rgba(187, 183, 206, var(--bg-opacity));
    --bg-opacity: 0.75
}

.media-library-dropzone-drop, .media-library-dropzone:not(:disabled):active, .media-library-dropzone:not(:disabled):focus {
    outline: 0;
    --bg-opacity: 1;
    background-color: #a9a5bf;
    background-color: rgba(169, 165, 191, var(--bg-opacity));
    --bg-opacity: 0.5;
    --border-opacity: 1;
    border-color: #514982;
    border-color: rgba(81, 73, 130, var(--border-opacity));
    --border-opacity: 0.25
}

.media-library-dropzone:disabled {
    --bg-opacity: 1;
    background-color: #de9fa6;
    background-color: rgba(222, 159, 166, var(--bg-opacity));
    --bg-opacity: 0.25;
    --border-opacity: 1;
    border-color: #a93147;
    border-color: rgba(169, 49, 71, var(--border-opacity));
    --border-opacity: 0.25;
    cursor: not-allowed
}

.media-library-properties {
    font-size: .75rem;
    --text-opacity: 1;
    color: #514982;
    color: rgba(81, 73, 130, var(--text-opacity));
    flex-grow: 1;
    min-width: 0;
    margin-right: 1rem;
    margin-top: 1rem;
    margin-bottom: 1rem
}

.media-library-single .media-library-properties {
    margin-top: 0;
    margin-bottom: 0
}

.media-library-properties-fixed {
    width: 8rem;
    flex-grow: 0
}

.media-library-property {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    --text-opacity: 1;
    color: #574f85;
    color: rgba(87, 79, 133, var(--text-opacity))
}

.media-library-field {
    overflow: hidden;
    margin-top: .5rem;
    margin-bottom: .5rem
}

.media-library-field-error {
    margin-top: .25rem;
    --text-opacity: 1;
    color: #a93147;
    color: rgba(169, 49, 71, var(--text-opacity))
}

.media-library-label {
    display: block;
    font-size: .75rem;
    --text-opacity: 1;
    color: #574f85;
    color: rgba(87, 79, 133, var(--text-opacity));
    padding-right: .5rem
}

.media-library-input {
    flex: 1 1 0%;
    width: 100%;
    font-size: .75rem;
    --text-opacity: 1;
    color: #13034a;
    color: rgba(19, 3, 74, var(--text-opacity));
    border-radius: .125rem;
    padding: .25rem .5rem;
    transition-property: background-color, border-color, color, fill, stroke;
    transition-duration: .3s
}

.media-library-input, .media-library-input:focus {
    --bg-opacity: 1;
    background-color: #e4e2ed;
    background-color: rgba(228, 226, 237, var(--bg-opacity))
}

.media-library-input:focus {
    outline: 0;
    --bg-opacity: 0.5
}

.media-library-button {
    width: 1.5rem;
    height: 1.5rem;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px 0 rgba(0, 0, 0, .06);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    line-height: 1;
    transition-duration: .1s;
    transition-property: all;
    border-width: 1px;
    --border-opacity: 1;
    border-color: #9a97af;
    border-color: rgba(154, 151, 175, var(--border-opacity));
    --border-opacity: 0.75;
    z-index: 10
}

.media-library-sortable .media-library-button {
    width: 1.25rem;
    height: 1.25rem
}

.media-library-button-info {
    color: #574f85;
    color: rgba(87, 79, 133, var(--text-opacity))
}

.media-library-button-info, .media-library-button-warning {
    --bg-opacity: 1;
    background-color: #fff;
    background-color: rgba(255, 255, 255, var(--bg-opacity));
    --text-opacity: 1
}

.media-library-button-warning {
    color: #c42543;
    color: rgba(196, 37, 67, var(--text-opacity))
}

.media-library-button-error {
    background-color: #c42543;
    background-color: rgba(196, 37, 67, var(--bg-opacity));
    --border-opacity: 1;
    border-color: #cc6875;
    border-color: rgba(204, 104, 117, var(--border-opacity))
}

.media-library-button-error, .media-library-button-success {
    --bg-opacity: 1;
    --text-opacity: 1;
    color: #fff;
    color: rgba(255, 255, 255, var(--text-opacity))
}

.media-library-button-success {
    background-color: #ffe375;
    background-color: rgba(255, 227, 117, var(--bg-opacity))
}

.media-library-replace .media-library-button {
    opacity: 0
}

.media-library-dropzone-drag + .media-library-placeholder .media-library-button, .media-library-dropzone:not(:disabled):focus .media-library-placeholder .media-library-button, .media-library-dropzone:not(:disabled):hover .media-library-placeholder .media-library-button {
    opacity: 1;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06)
}

.media-library-dropzone-drop .media-library-placeholder .media-library-button, .media-library-dropzone:not(:disabled):active .media-library-placeholder .media-library-button {
    opacity: 1;
    box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .06)
}

.media-library-icon {
    width: 1.5rem;
    height: 1.5rem
}

.media-library-icon-fill {
    fill: currentColor
}

.media-library-progress-wrap {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding-left: .75rem;
    padding-right: .75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    --bg-opacity: 1;
    background-color: #a9a5bf;
    background-color: rgba(169, 165, 191, var(--bg-opacity));
    --bg-opacity: 0.5;
    z-index: 10;
    opacity: 0;
    transition-property: opacity;
    transition-duration: .3s;
    pointer-events: none
}

.media-library-progress-wrap-loading {
    opacity: 1
}

.media-library-progress {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: .25rem;
    width: 100%;
    max-width: 28rem;
    --bg-opacity: 1;
    background-color: #fff;
    background-color: rgba(255, 255, 255, var(--bg-opacity));
    border-radius: 9999px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px 0 rgba(0, 0, 0, .06)
}

.media-library progress::-webkit-progress-bar {
    -webkit-appearance: none;
    appearance: none;
    border-radius: 9999px;
    --bg-opacity: 1;
    background-color: #fff;
    background-color: rgba(255, 255, 255, var(--bg-opacity))
}

.media-library progress::-moz-progress-bar {
    height: 100%;
    --bg-opacity: 1;
    background-color: #574f85;
    background-color: rgba(87, 79, 133, var(--bg-opacity))
}

.media-library progress::-webkit-progress-value {
    height: 100%;
    --bg-opacity: 1;
    background-color: #574f85;
    background-color: rgba(87, 79, 133, var(--bg-opacity))
}

.media-library-text-separator {
    opacity: .5;
    padding-left: .25rem;
    padding-right: .25rem
}

.media-library-text-success {
    --text-opacity: 1;
    color: #429b59;
    color: rgba(66, 155, 89, var(--text-opacity))
}

.media-library-text-error {
    --text-opacity: 1;
    color: #a93147;
    color: rgba(169, 49, 71, var(--text-opacity))
}

.media-library-text-link {
    text-decoration: underline;
    cursor: pointer
}

.media-library-hidden {
    display: none
}

.🖼 {
    position: absolute;
    border-radius: .125rem;
    overflow: hidden;
    left: 2rem;
    top: -2rem;
    opacity: .67;
    width: 75%;
    height: 100%
}

.🖼 img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

@media (min-width: 640px) {
    .🖼 {
        position: absolute;
        border-radius: .125rem;
        overflow: hidden;
        left: -2rem;
        top: -2rem;
        opacity: .67;
        width: 66%;
        height: 100%
    }
}

.updates {
    box-shadow: 5px 5px 0 rgba(0, 0, 0, .05);
    overflow: hidden;
    border-width: 2px;
    --border-opacity: 1;
    border-color: #fff;
    border-color: rgba(255, 255, 255, var(--border-opacity));
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transform: translateZ(0)
}

.updates, .updates-input {
    --bg-opacity: 1;
    background-color: #fff;
    background-color: rgba(255, 255, 255, var(--bg-opacity));
    border-radius: 9999px
}

.updates-input {
    height: 2.5rem;
    padding-left: 1rem;
    --text-opacity: 1;
    color: #13034a;
    color: rgba(19, 3, 74, var(--text-opacity));
    border-style: none;
    width: calc(100% - 2.25rem)
}

.updates-button {
    position: absolute;
    right: 0;
    top: 0;
    transform: scale(1);
    transition: transform .5s ease
}

.updates-input:invalid + .updates-button {
    cursor: not-allowed
}

.updates-input:valid + .updates-button:hover {
    transform: scale(.85)
}

.updates-input:valid + .updates-button:active {
    transform: scale(.5)
}

.updates-button-icon {
    display: flex;
    border-radius: 9999px;
    --text-opacity: 1;
    color: #13034a;
    color: rgba(19, 3, 74, var(--text-opacity));
    --bg-opacity: 1;
    background-color: #ffe375;
    background-color: rgba(255, 227, 117, var(--bg-opacity));
    align-items: center;
    justify-content: center;
    font-weight: 700;
    height: 2.5rem;
    width: 2.5rem;
    line-height: 1;
    text-indent: .25em;
    transform: rotate(0);
    transition: transform .5s ease, color .5s ease, background .5s ease
}

.updates-input:invalid + .updates-button .updates-button-icon {
    transform: rotate(180deg);
    --bg-opacity: 1;
    background-color: #eae8f4;
    background-color: rgba(234, 232, 244, var(--bg-opacity));
    --text-opacity: 1;
    color: #574f85;
    color: rgba(87, 79, 133, var(--text-opacity));
    transition-delay: .5s
}

.hljs {
    display: block;
    --bg-opacity: 1;
    background-color: #13034a;
    background-color: rgba(19, 3, 74, var(--bg-opacity));
    --text-opacity: 1;
    color: #e4e2ed;
    color: rgba(228, 226, 237, var(--text-opacity));
    padding: 1rem 2rem;
    overflow-x: auto;
    overflow-y: hidden;
    line-height: 2;
    font-size: .75rem;
    height: 14rem
}

.hljs::-webkit-scrollbar-corner, .hljs::-webkit-scrollbar-track {
    background-color: transparent
}

.hljs-comment, .hljs-meta {
    --text-opacity: 1;
    color: #574f85;
    color: rgba(87, 79, 133, var(--text-opacity))
}

.hljs-emphasis, .hljs-quote, .hljs-strong, .hljs-template-variable, .hljs-variable {
    color: #df5000
}

.hljs-keyword, .hljs-selector-tag, .hljs-type {
    color: #d73a49
}

.hljs-attribute, .hljs-bullet, .hljs-literal, .hljs-symbol {
    color: #0086b3
}

.hljs-name, .hljs-section {
    --text-opacity: 1;
    color: #fde4a0;
    color: rgba(253, 228, 160, var(--text-opacity))
}

.hljs-tag {
    --text-opacity: 1;
    color: #a9a5bf;
    color: rgba(169, 165, 191, var(--text-opacity))
}

.hljs-attr, .hljs-selector-attr, .hljs-selector-class, .hljs-selector-id, .hljs-selector-pseudo, .hljs-title {
    --text-opacity: 1;
    color: #cc6875;
    color: rgba(204, 104, 117, var(--text-opacity))
}

.hljs-addition {
    color: #55a532;
    background-color: #eaffea
}

.hljs-deletion {
    color: #bd2c00;
    background-color: #ffecec
}

.hljs-link {
    text-decoration: underline
}

.hljs-number {
    color: #005cc5
}

.hljs-string {
    --text-opacity: 1;
    color: #bbb7ce;
    color: rgba(187, 183, 206, var(--text-opacity))
}