.surface-dialog{position:fixed;inset:1rem;width:min(76rem,calc(100vw - 2rem));max-width:none;max-height:calc(100dvh - 2rem);margin:auto;padding:0;overflow:visible;border:0;border-radius:var(--paper-radius);background:var(--paper-fiber),var(--paper);color:var(--ink);box-shadow:0 24px 80px #14202a55;transform-origin:top left}.surface-dialog::backdrop{background:#16232dbd;animation:surface-backdrop .24s ease both}.surface-dialog__frame{max-height:calc(100dvh - 2rem);overflow-y:auto;overscroll-behavior:contain;border:0;border-radius:inherit}.surface-dialog__toolbar{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:64px;padding:.6rem clamp(1rem,3vw,2rem);border-bottom:1px solid var(--line);background:var(--paper)}.surface-dialog__toolbar strong{min-width:0;font-size:clamp(1.15rem,1.8vw,1.5rem);font-weight:600;letter-spacing:-.014em;line-height:1.18;overflow-wrap:anywhere}.surface-dialog__close{display:grid;place-items:center;flex:none;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:var(--paper);color:var(--ink);cursor:pointer}.surface-dialog__close:hover{background:var(--paper-deep)}.surface-dialog__close:focus-visible{background:var(--ink);color:var(--paper)}.surface-dialog__content{padding:clamp(1rem,3.5vw,3rem)}.surface-dialog__content.is-flush{padding:0}.surface-dialog__content>.frag{width:min(100%,62rem);max-width:none;margin-inline:auto}.surface-dialog__content>img{width:100%;height:auto;max-height:calc(100dvh - 10rem);-o-object-fit:contain;object-fit:contain}@keyframes surface-backdrop{0%{opacity:0}to{opacity:1}}@media(max-width:600px){.surface-dialog{inset:max(.5rem,env(safe-area-inset-top)) max(.5rem,env(safe-area-inset-right)) max(.5rem,env(safe-area-inset-bottom)) max(.5rem,env(safe-area-inset-left));width:calc(100% - 1rem - env(safe-area-inset-left) - env(safe-area-inset-right));max-height:calc(100dvh - 1rem - env(safe-area-inset-top) - env(safe-area-inset-bottom))}.surface-dialog__frame{max-height:inherit}.surface-dialog__content{padding:.75rem}.surface-dialog__content.is-flush{padding:0}}@media(prefers-reduced-motion:reduce){.surface-dialog::backdrop{animation:none}}
