/* Site-wide responsive — The Lemonade Game */

html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

img,
video,
canvas,
svg {
    max-width: 100%;
    height: auto;
}

/* Auth, install, simple content pages */
.nbAuthPageOuter,
.installBoxOuter {
    padding: 12px;
}

/* Reader — chapter picker */
body.nbReaderPick main {
    max-width: 100%;
    padding: 16px 14px 28px;
}

body.nbReaderPick .readerPickScroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 0 -4px;
    padding: 0 4px;
}

body.nbReaderPick table {
    min-width: 520px;
}

body.nbReaderPick .readerFinishBanner {
    font-size: 0.95rem;
    padding: 16px 18px;
}

/* Reader — spread view */
body.nbReaderSpread .readerSpreadWrap {
    min-height: 0;
}

body.nbReaderSpread .spread {
    min-height: 0;
}

body.nbReaderSpread .pane.left,
body.nbReaderSpread .pane.right {
    min-height: 200px;
}

body.nbReaderSpread .paneCanvas {
    min-height: 160px;
}

body.nbReaderSpread .readerNavFloat {
    max-width: min(100%, 100vw);
    right: 0;
    left: 0;
    border-radius: 0;
}

body.nbReaderSpread .readerToolbar .spreadCounter {
    font-size: 0.68rem;
}

body.nbReaderSpread .navBtn {
    width: 36px;
    height: 36px;
}

/* Worksheets (car / credit card amortization) */
.acl-wrap,
.acc-wrap,
.smm-wrap {
    width: 100%;
    max-width: 100%;
}

.acl-topRow,
.acc-topRow {
    flex-direction: column;
    align-items: stretch;
}

.acl-title,
.acc-title {
    font-size: 1rem;
}

.acl-playBtn,
.acc-playBtn {
    text-align: center;
    width: 100%;
    max-width: 100%;
}

.acl-grid2,
.acc-grid2 {
    grid-template-columns: 1fr;
}

.acl-tableScroll,
.acc-tableScroll,
.smm-table-scroll {
    -webkit-overflow-scrolling: touch;
}

/* Embedded reader iframes */
body.nbEmbedReader {
    overflow: auto;
    height: auto;
    min-height: 100%;
}

/* Admin */
.admMain {
    padding: 16px 14px 32px;
}

.admMain .fbc-table-wrap,
.admMain table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 900px) {
    body.nbReaderSpread .spread {
        flex-direction: column;
    }

    body.nbReaderSpread .pane.left {
        border-right: none;
        border-bottom: 1px solid #bbb;
        flex: 0 0 auto;
        max-height: 45vh;
    }

    body.nbReaderSpread .pane.right {
        flex: 1 1 auto;
        min-height: 45vh;
    }

    body.nbReaderSpread .pane.left .paneCanvas {
        min-height: 120px;
    }
}

@media (max-width: 768px) {
    .admTop {
        padding: 10px 14px;
    }

    .admTopBrandText .admTopTitle {
        font-size: 0.95rem;
    }

    .admTopSub {
        display: none;
    }

    .admMain h1 {
        font-size: 1.25rem;
    }

    #slideGrid {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 480px) {
    .tlgBrandText {
        font-size: 0.88rem;
    }

    .tlgLogoImg {
        width: 38px;
        height: 38px;
    }

    body.nbReaderPick th,
    body.nbReaderPick td {
        padding: 10px 12px;
        font-size: 0.88rem;
    }

    .acl-wrap,
    .acc-wrap,
    .smm-wrap,
    body.acl-page,
    body.acc-page {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}