:root{--dialog-gap:16px;--dialog-inner-gap:8px;--dialog-close-size:40px;--dialog-max-width:1200px;--dialog-portrait-max-height:800px;--dialog-radius:5px}html:has(.dialog[open]){overflow:hidden}.dialog{align-items:center;background-color:transparent;border:none;display:none;height:100vh;height:100dvh;justify-content:center;margin:0;max-height:100vh;max-height:100dvh;max-width:100vw;overflow:hidden;padding:var(--dialog-gap);width:100vw}.dialog[open]{display:flex}.dialog:not([open]){pointer-events:none}.dialog::backdrop{background-color:hsla(0,0%,8%,.8)}.dialog,.dialog::backdrop{opacity:0;transition:opacity .2s ease,display allow-discrete .2s,overlay allow-discrete .2s}.dialog[open],.dialog[open]::backdrop{opacity:1}@starting-style{.dialog[open],.dialog[open]::backdrop{opacity:0}}.dialog__inner{align-items:flex-end;display:flex;flex-flow:column;gap:var(--dialog-inner-gap);max-height:100%;max-width:100%}.dialog__content{background-color:var(--color-neutral-100);border-radius:var(--dialog-radius);color:var(--color-neutral-0);min-height:0;overflow:auto;overscroll-behavior:contain;width:min(var(--dialog-max-width),100%)}.dialog__close{background-color:var(--color-neutral-0);border:none;border-radius:50%;cursor:pointer;display:grid;flex:none;height:var(--dialog-close-size);padding:0;place-items:center;transition:background-color .2s ease;width:var(--dialog-close-size)}.dialog__close:focus-visible,.dialog__close:hover{background-color:var(--color-neutral-50)}.dialog__close:before{background-color:var(--color-neutral-100);content:"";height:16px;-webkit-mask:var(--icon-close) center center /contain no-repeat;mask:var(--icon-close) center center /contain no-repeat;width:16px}.dialog--padded .dialog__content{padding:24px}.dialog--media .dialog__content{background-color:transparent;display:flex;max-width:100%;overflow:visible;width:fit-content}.dialog__video{border-radius:var(--dialog-radius);max-height:calc(100vh - var(--dialog-gap)*2 - var(--dialog-close-size) - var(--dialog-inner-gap));max-height:calc(100dvh - var(--dialog-gap)*2 - var(--dialog-close-size) - var(--dialog-inner-gap));max-width:min(var(--dialog-max-width),calc(100vw - var(--dialog-gap)*2))}.dialog__video,.dialog__youtube{background-color:var(--color-neutral-0);display:block}.dialog__youtube{aspect-ratio:16/9;border:none;border-radius:var(--dialog-radius);height:min(calc(var(--dialog-max-width)/16*9),calc(56.25vw - var(--dialog-gap)*2/16*9),calc(100vh - var(--dialog-gap)*2 - var(--dialog-close-size) - var(--dialog-inner-gap)));height:min(calc(var(--dialog-max-width)/16*9),calc(56.25vw - var(--dialog-gap)*2/16*9),calc(100dvh - var(--dialog-gap)*2 - var(--dialog-close-size) - var(--dialog-inner-gap)));width:auto}.dialog--portrait .dialog__youtube{aspect-ratio:9/16;height:min(var(--dialog-portrait-max-height),calc(100vh - var(--dialog-gap)*2 - var(--dialog-close-size) - var(--dialog-inner-gap)),calc(177.77778vw - var(--dialog-gap)*2/9*16));height:min(var(--dialog-portrait-max-height),calc(100dvh - var(--dialog-gap)*2 - var(--dialog-close-size) - var(--dialog-inner-gap)),calc(177.77778vw - var(--dialog-gap)*2/9*16))}@media (min-width:600px){:root{--dialog-gap:24px}.dialog--padded .dialog__content{padding:40px}}