.gsap-shape-build__stage {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: min(72vh, 560px);
    padding: 2rem 1rem;
    overflow: hidden;
}

.gsap-shape-build__grid-wrap {
    position: relative;
    width: min(280px, 72vw);
    margin: 0 auto;
    aspect-ratio: 5 / 7;
}

.gsap-shape-build__grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(7, 1fr);
    gap: 5px;
    width: 100%;
    height: 100%;
}

.gsap-shape-build__block {
    opacity: 0;
    border-radius: 2px;
    background: color-mix(in srgb, var(--gsap-shape-build-color, #e7393b) 12%, #f3f4f6);
    border: 1px solid color-mix(in srgb, var(--gsap-shape-build-color, #e7393b) 22%, #e5e7eb);
    will-change: transform, opacity;
}

.gsap-shape-build__block.is-window {
    background: color-mix(in srgb, var(--gsap-shape-build-color, #e7393b) 35%, #fff);
}

.gsap-shape-build__block.is-structure {
    background: var(--gsap-shape-build-color, #e7393b);
    border-color: var(--gsap-shape-build-color, #e7393b);
}

.gsap-shape-build__block.is-letter {
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--gsap-shape-build-color, #e7393b) 8%, #fff);
    border-color: color-mix(in srgb, var(--gsap-shape-build-color, #e7393b) 18%, #e5e7eb);
}

.gsap-shape-build__block-letter {
    font-weight: 700;
    font-size: clamp(0.7rem, 4.2vw, 1rem);
    line-height: 1;
    letter-spacing: 0.04em;
    color: var(--gsap-shape-build-letter-color, var(--gsap-shape-build-color, #e7393b));
    user-select: none;
}

.gsap-shape-build__block.is-letter-line .gsap-shape-build__block-letter,
.gsap-shape-build__block.is-letter-bar .gsap-shape-build__block-letter {
    font-size: clamp(0.5rem, 2.8vw, 0.72rem);
    font-weight: 300;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.gsap-shape-build__svg {
    display: block;
    width: min(340px, 82vw);
    height: auto;
    margin: 0 auto;
    overflow: visible;
}

.gsap-shape-build__svg--landscape {
    width: min(640px, 96vw);
}

.gsap-shape-build__path {
    fill: none;
    stroke: var(--gsap-shape-build-color, #e7393b);
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
    visibility: hidden;
}