body {
    padding: 0;
    margin: 0;
}

.mobile-subpanel-container {
    container-type: inline-size;
    container-name: mobile-subpanel;
    min-width: 0;
    max-width: 25em;
}

/* Default to desktop/tablet full controls; container query will override when narrow. */
.mobile-tabbed-subpanel {
    display: none;
}

.horizontal-tab-container {
    display: flex;
}

.notice-text {
    text-align: center;
}

.preset-delete-btn {
    opacity: 1;
    pointer-events: auto;
}

@container mobile-subpanel (max-width: 23.499em) {
    .mobile-tabbed-subpanel {
        display: block;
    }

    .horizontal-tab-container {
        display: none;
    }
}

@container mobile-subpanel (min-width: 23.5em) {
    .mobile-tabbed-subpanel {
        display: none;
    }

    .horizontal-tab-container {
        display: flex;
    }


    @media screen and (min-width: 30em) {
        .notice-text {
            text-align: left;
        }
    }
}

.shape-pane {
    order: 1;
}

.meta-pane {
    order: 2;
}

.w23 {
    width: 3rem;
}

.h23 {
    height: 3rem;
}

.w6 {
    width: 32rem;
}

@media screen and (min-width: 30em) {
    .preset-delete-btn {
        opacity: 0;
        pointer-events: none;
        transition: opacity 120ms ease;
    }

    .preset-item:hover .preset-delete-btn {
        opacity: 1;
        pointer-events: auto;
    }

    .w6-ns {
        width: 32rem;
    }

    .w3-ns {
        width: 4rem;
    }
    
    .h3-ns {
        height: 4rem;
    }

    .w23-ns {
        width: 3rem;
    }
    
    .h23-ns {
        height: 3rem;
    }
}

@media screen and (min-width: 30em) and (max-width: 60em) {
    .w3-m {
        width: 4rem;
    }
    
    .h3-m {
        height: 4rem;
    }

    .w23-m {
        width: 3rem;
    }
    
    .h23-m {
        height: 3rem;
    }

    .w6-m {
        width: 32rem;
    }
}

@media screen and (min-width: 60em) {
    .w4-l {
        width: 4rem;
    }
    
    .h4-l {
        height: 4rem;
    }

    .w23-l {
        width: 3rem;
    }
    
    .h23-l {
        height: 3rem;
    }

    .w6-l {
        width: 32rem;
    }
}
