.amba-flipbook {
    --amba-flipbook-height: 720px;
    --amba-flipbook-accent: #8ce433;
    --amba-flipbook-accent-dark: #3ba317;
    --amba-flipbook-blue: #1b8fd9;
    --amba-flipbook-dark: #0b243c;
    --amba-flipbook-light: #ffffff;
    width: 100%;
    max-width: 1180px;
    margin: 24px auto;
    font-family: inherit;
}

.amba-flipbook,
.amba-flipbook * {
    box-sizing: border-box;
}

.amba-flipbook__viewer {
    position: relative;
    overflow: hidden;
    min-height: 460px;
    border-radius: 3px;
    background:
        radial-gradient(circle at 18% 90%, rgba(255, 255, 255, 0.9) 0 3%, transparent 18%),
        radial-gradient(circle at 18% 115%, rgba(19, 112, 190, 0.55) 0 8%, transparent 22%),
        linear-gradient(140deg, #f8fcff 0%, #dcebf6 28%, #ffffff 56%, #e9f3fb 100%);
    box-shadow: 0 20px 55px rgba(0, 0, 0, 0.22);
}

.amba-flipbook__viewer::before,
.amba-flipbook__viewer::after {
    content: "";
    position: absolute;
    pointer-events: none;
    opacity: 0.45;
}

.amba-flipbook__viewer::before {
    inset: 0;
    background:
        linear-gradient(35deg, transparent 0 39%, rgba(255, 255, 255, 0.65) 40%, transparent 41%),
        linear-gradient(150deg, transparent 0 32%, rgba(66, 141, 197, 0.28) 33%, transparent 34%),
        linear-gradient(25deg, transparent 0 58%, rgba(35, 110, 176, 0.2) 59%, transparent 60%);
}

.amba-flipbook__viewer::after {
    left: 7%;
    bottom: 48px;
    width: 260px;
    height: 120px;
    border-radius: 70% 40% 60% 35%;
    background: linear-gradient(135deg, rgba(27, 143, 217, 0.85), rgba(27, 143, 217, 0));
    transform: rotate(-16deg);
}

.amba-flipbook__brandline {
    position: absolute;
    top: 18px;
    left: 22px;
    z-index: 4;
    display: inline-flex;
    align-items: center;
    max-width: calc(100% - 44px);
    gap: 10px;
    padding: 8px 12px;
    border-radius: 999px;
    color: #ffffff;
    background: rgba(7, 35, 67, 0.58);
    backdrop-filter: blur(8px);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.15);
}

.amba-flipbook__brand-mark {
    width: 21px;
    height: 21px;
    border-radius: 5px 12px 5px 12px;
    background: linear-gradient(135deg, #ff3a30, #ffb703 45%, #80df30 100%);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
    transform: skewY(-8deg);
    flex: 0 0 auto;
}

.amba-flipbook__title {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
}

.amba-flipbook__stage {
    position: relative;
    z-index: 2;
    min-height: 420px;
    height: var(--amba-flipbook-height, 720px);
    max-height: 88vh;
    padding: 70px 38px 88px;
    overflow: auto;
}

.amba-flipbook__loading {
    position: absolute;
    inset: 70px 38px 88px;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    color: #12314d;
    background: rgba(255, 255, 255, 0.84);
    font-weight: 700;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7);
}

.amba-flipbook__loading--error {
    color: #b00020;
}

.amba-flipbook__book {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 0;
    min-height: 100%;
    perspective: 1800px;
    transform-origin: center center;
}

.amba-flipbook__book.is-flipping {
    animation: ambaFlip 390ms ease;
}

.amba-flipbook__page {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    min-height: 360px;
    padding: 12px;
    background: #ffffff;
    box-shadow: 0 18px 40px rgba(4, 21, 42, 0.35);
}

.amba-flipbook__page--left {
    border-radius: 5px 0 0 5px;
    transform-origin: right center;
}

.amba-flipbook__page--right {
    border-radius: 0 5px 5px 0;
    transform-origin: left center;
}

.amba-flipbook__spine {
    position: relative;
    z-index: 3;
    width: 18px;
    min-height: 460px;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.38), rgba(255, 255, 255, 0.55), rgba(0, 0, 0, 0.38));
    box-shadow:
        inset 0 0 22px rgba(0, 0, 0, 0.35),
        0 8px 18px rgba(0, 0, 0, 0.25);
}

.amba-flipbook canvas {
    display: block;
    max-width: 100%;
    height: auto;
    background: #ffffff;
}

.amba-flipbook__toolbar {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 6;
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 14px 14px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(188, 203, 218, 0.93));
    border-top: 1px solid rgba(255, 255, 255, 0.9);
    box-shadow: 0 -10px 24px rgba(6, 32, 64, 0.16);
}

.amba-flipbook__buttons {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 16px;
    width: 100%;
}

.amba-flipbook__btn {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    color: #ffffff;
    font-size: 24px;
    font-weight: 900;
    line-height: 1;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    box-shadow:
        inset 0 2px 6px rgba(255, 255, 255, 0.6),
        inset 0 -7px 13px rgba(0, 0, 0, 0.16),
        0 9px 15px rgba(0, 0, 0, 0.24);
    transition: transform 160ms ease, filter 160ms ease, opacity 160ms ease;
}

.amba-flipbook__btn span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    transform: translateY(-1px);
}

.amba-flipbook__btn:hover,
.amba-flipbook__btn:focus {
    color: #ffffff;
    filter: brightness(1.06);
    transform: translateY(-2px);
    text-decoration: none;
}

.amba-flipbook__btn--blue {
    background: radial-gradient(circle at 30% 20%, #b6ebff 0%, #2ca0e6 38%, #0960a8 100%);
}

.amba-flipbook__btn--green {
    background: radial-gradient(circle at 32% 18%, #d9ff99 0%, #77d72f 40%, #23a018 100%);
}

.amba-flipbook__btn--silver {
    color: #23415c;
    background: radial-gradient(circle at 34% 18%, #ffffff 0%, #e9edf2 42%, #bfcbd7 100%);
}

.amba-flipbook__btn--silver:hover,
.amba-flipbook__btn--silver:focus {
    color: #23415c;
}

.amba-flipbook__btn--wide {
    width: 76px;
    border-radius: 28px;
    font-size: 36px;
}

.amba-flipbook__download {
    font-size: 27px;
}

.amba-flipbook__page-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 86px;
    height: 38px;
    padding: 0 12px;
    border-radius: 999px;
    color: #113450;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: inset 0 0 0 1px rgba(13, 61, 102, 0.12), 0 4px 10px rgba(0, 0, 0, 0.12);
    font-size: 13px;
    font-weight: 800;
}

.amba-flipbook--single .amba-flipbook__book {
    display: block;
}

.amba-flipbook--single .amba-flipbook__page--left {
    width: max-content;
    max-width: 100%;
    margin: 0 auto;
    border-radius: 5px;
}

.amba-flipbook--single .amba-flipbook__page--right,
.amba-flipbook--single .amba-flipbook__spine {
    display: none;
}

.amba-flipbook:fullscreen {
    max-width: none;
    width: 100vw;
    height: 100vh;
    margin: 0;
    border-radius: 0;
    background: #eaf3fb;
}

.amba-flipbook:fullscreen .amba-flipbook__viewer {
    width: 100vw;
    height: 100vh;
    min-height: 100vh;
    border-radius: 0;
}

.amba-flipbook:fullscreen .amba-flipbook__stage {
    height: 100vh;
    max-height: none;
}

.amba-flipbook-error {
    padding: 14px 16px;
    border-radius: 8px;
    color: #b00020;
    background: #fff0f3;
    font-weight: 700;
}

@keyframes ambaFlip {
    0% { transform: rotateY(0deg) scale(1); opacity: 0.88; }
    50% { transform: rotateY(-5deg) scale(0.992); opacity: 0.96; }
    100% { transform: rotateY(0deg) scale(1); opacity: 1; }
}

@media (max-width: 900px) {
    .amba-flipbook__stage {
        padding-left: 20px;
        padding-right: 20px;
    }

    .amba-flipbook__buttons {
        gap: 10px;
    }

    .amba-flipbook__btn {
        width: 44px;
        height: 44px;
        font-size: 20px;
    }

    .amba-flipbook__btn--wide {
        width: 60px;
        font-size: 30px;
    }
}

@media (max-width: 720px) {
    .amba-flipbook {
        margin: 16px auto;
    }

    .amba-flipbook__brandline {
        top: 12px;
        left: 12px;
        max-width: calc(100% - 24px);
    }

    .amba-flipbook__stage {
        height: min(var(--amba-flipbook-height, 620px), 82vh);
        padding: 58px 14px 118px;
    }

    .amba-flipbook__loading {
        inset: 58px 14px 118px;
    }

    .amba-flipbook__toolbar {
        min-height: 104px;
        padding: 10px 10px 12px;
    }

    .amba-flipbook__buttons {
        gap: 8px;
    }

    .amba-flipbook__btn {
        width: 39px;
        height: 39px;
        font-size: 17px;
    }

    .amba-flipbook__btn--wide {
        width: 52px;
        font-size: 25px;
    }

    .amba-flipbook__page-count {
        min-width: 70px;
        height: 32px;
        font-size: 12px;
    }

    .amba-flipbook__page {
        padding: 8px;
    }
}