@media(max-width:68em){main>:last-child{padding-bottom:6.854em}}

.action-container{
    width:min(100%,38ch);
    min-height: 2.618em;
    margin:0 auto}

*+.action-container{margin-top: 1em}

/*IO*/
@keyframes donation-appear {
    to{opacity: 1;transform: translateY(0)}
}

.not-at-top .action-container>div{
    padding:1em;
    border-top:1px solid rgba(0,0,0,.1);
    min-width: 100%;
    opacity: 0;
    transform: translateY(5rem);
    animation: donation-appear .5s .3s ease forwards;
    position: fixed;
    bottom: 0;
    bottom: env(safe-area-inset-bottom);
    right: 0;
    right: calc(1px + env(safe-area-inset-right));
    z-index: 999;
    background: rgba(255,255,255,1)}

.not-at-top #eop.trigger.visible+.response .action-container>div{position: absolute!important}

.trigger{
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 1px;
    height: 1px}

@media(min-width:100ch){
    .not-at-top .action-container>div{
        min-width: unset;
        width:min((100vw - 2em) - (62ch + 3vw), 32.66ch);
        border:1px solid rgba(0,0,0,.1);
        border-bottom: none;
        right: calc((100% - (var(--ch-unit)*100)) / 2);
        right: max(1em,((100% - (var(--ch-unit)*100)) / 2));
        border-top-left-radius: 1em;
        border-top-right-radius: 1em;
        box-shadow:0 0 1ch rgba(0,0,0,.03),0 0 .236ch rgba(0,0,0,.03),0 0 .382ch rgba(0,0,0,.03),.236ch .382ch .618ch rgba(0,0,0,.03)}
}