/* Asset: scanio_fridge.css */

    .todayActions {
        display: flex;
        align-items: center;
        gap: 7px
    }

    .fridgeShortcut {
        min-width: 52px;
        height: 45px;
        padding: 5px 8px;
        border: 0;
        border-radius: 18px;
        display: grid;
        grid-template-columns:auto auto;
        grid-template-rows:auto auto;
        align-items: center;
        justify-content: center;
        gap: 0 5px;
        color: var(--deep);
        background: rgba(255, 253, 247, .94);
        box-shadow: 0 11px 28px rgba(15, 23, 18, .10);
        cursor: pointer
    }

    .fridgeShortcut > span {
        grid-row: 1/3;
        font-size: 17px
    }

    .fridgeShortcut b {
        font-size: 8px;
        line-height: 1
    }

    .fridgeShortcut small {
        font-size: 9px;
        line-height: 1;
        color: var(--muted);
        font-weight: 950
    }

    .proofShortcut {
        min-width: 48px;
        height: 49px;
        padding: 4px 7px;
        border: 0;
        border-radius: 18px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 3px;
        color: var(--deep);
        background: rgba(255, 253, 247, .94);
        box-shadow: 0 11px 28px rgba(15, 23, 18, .10);
        cursor: pointer
    }

    .proofShortcut b {
        font-size: 7px;
        line-height: 1;
        white-space: nowrap
    }

    .proofShortcut span {
        font-size: 17px;
        font-weight: 950;
        line-height: 1
    }

    .fridgeView {
        padding-bottom: 142px;
        background: radial-gradient(circle at 92% 4%, rgba(183, 255, 106, .18), transparent 26%),
        radial-gradient(circle at 4% 72%, rgba(32, 196, 111, .10), transparent 30%),
        #f6f0e5
    }

    .fridgeHead {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 12px
    }

    .fridgeTopBar {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 14px;
    }

    .fridgeTopBar .fridgeBack {
        margin-bottom: 0;
    }

    .fridgeTopBar #fridgeCount {
        margin-left: auto;
    }

    .fridgeHead > div {
        position: relative;
        /*padding-left: 31px*/
    }

    .fridgeBack {
        width: 25px;
        height: 25px;
        border: 0;
        border-radius: 50%;
        background: rgba(255, 253, 247, .96);
        color: var(--ink);
        font-size: 22px;
        line-height: 20px;
        box-shadow: 0 7px 18px rgba(15, 23, 18, .08);
        cursor: pointer;
        margin-bottom: 20px;
    }

    .fridgeEyebrow {
        margin: 0 0 4px;
        color: var(--deep);
        font-size: 8px;
        font-weight: 950;
        letter-spacing: .12em;
        text-transform: uppercase
    }

    .fridgePrivacy {

        display: none;
        /* display: grid;*/
        grid-template-columns:25px 1fr;
        gap: 1px 8px;
        align-items: center;
        margin: 14px 0 10px;
        padding: 10px 12px;
        border: 1px solid rgba(14, 123, 67, .12);
        border-radius: 18px;
        background: rgba(255, 253, 247, .74)
    }

    .fridgeIntroLayout {
        display: grid;
        gap: 16px;
    }

    .fridgeScanOptions {
        display: grid;
        gap: 10px;
        margin: 16px 0 14px;
    }

    .fridgeScanOption {
        min-width: 0;
        min-height: 134px;
        padding: 15px;
        display: grid;
        grid-template-columns: 42px minmax(0, 1fr);
        gap: 11px;
        align-items: start;
        border: 1px solid rgba(255, 255, 255, .84);
        border-radius: 21px;
        background: rgba(255, 253, 247, .88);
        box-shadow: 0 12px 27px rgba(15, 23, 18, .08);
    }

    .fridgeScanOption.receipt {
        background: linear-gradient(135deg, rgba(255, 253, 247, .97), rgba(239, 255, 232, .91));
    }

    .fridgeScanOption.ingredients {
        background: linear-gradient(135deg, rgba(255, 253, 247, .97), rgba(227, 248, 239, .90));
    }

    .fridgeScanOptionIcon {
        width: 42px;
        height: 42px;
        display: grid;
        place-items: center;
        border-radius: 14px;
        color: var(--deep);
        background: rgba(32, 196, 111, .14);
        font-size: 23px;
        font-weight: 950;
    }

    .fridgeScanOption.ingredients .fridgeScanOptionIcon {
        color: #12684d;
        background: rgba(84, 244, 255, .18);
    }

    .fridgeScanOptionContent h3 {
        margin: 1px 0 4px;
        font-size: 13px;
        letter-spacing: -.02em;
    }

    .fridgeScanOptionContent p {
        margin: 0;
        color: var(--muted);
        font-size: 10px;
        font-weight: 700;
        line-height: 1.35;
    }

    .fridgeScanOptionContent button {
        min-height: 31px;
        margin-top: 10px;
        padding: 7px 11px;
        border: 0;
        border-radius: 11px;
        color: #062616;
        background: var(--lime);
        box-shadow: 0 7px 14px rgba(14, 123, 67, .12);
        font-size: 9px;
        font-weight: 950;
        cursor: pointer;
    }

    .fridgeScanOption.ingredients .fridgeScanOptionContent button {
        color: white;
        background: var(--deep);
    }

    .fridgePrivacy > span {
        grid-row: 1/3;
        display: grid;
        place-items: center;
        width: 25px;
        height: 25px;
        border-radius: 10px;
        background: rgba(32, 196, 111, .13);
        color: var(--deep)
    }

    .fridgePrivacy b {
        font-size: 10px
    }

    .fridgePrivacy small {
        color: var(--muted);
        font-size: 8px;
        font-weight: 750
    }

    .fridgeSearch {
        height: 42px;
        padding: 0 13px;
        display: flex;
        align-items: center;
        gap: 8px;
        border-radius: 16px;
        background: rgba(255, 253, 247, .94);
        box-shadow: 0 10px 24px rgba(15, 23, 18, .07)
    }

    .fridgeSearch span {
        font-size: 18px;
        color: var(--muted)
    }

    .fridgeSearch input {
        min-width: 0;
        flex: 1;
        border: 0;
        outline: 0;
        background: transparent;
        color: var(--ink);
        font: 800 11px/1 inherit
    }

    .fridgeGrid {
        display: grid;
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap: 11px;
        margin-top: 12px
    }

    .fridgeCard {
        position: relative;
        min-width: 0;
        padding: 7px;
        border: 1px solid rgba(255, 255, 255, .9);
        border-radius: 22px;
        background: rgba(255, 253, 247, .94);
        box-shadow: 0 13px 28px rgba(15, 23, 18, .09);
        transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease
    }

    .fridgeCard.selected {
        border-color: var(--green);
        box-shadow: 0 0 0 3px rgba(32, 196, 111, .18), 0 16px 34px rgba(15, 23, 18, .12);
        transform: translateY(-2px)
    }

    .fridgeCardSelect {
        display: block;
        width: 100%;
        padding: 0;
        border: 0;
        background: transparent;
        text-align: left;
        color: inherit;
        cursor: pointer
    }

    .fridgePhotoCollage {
        position: relative;
        width: 100%;
        aspect-ratio: 1.14/1;
        display: grid;
        grid-template-columns:repeat(2, 1fr);
        grid-auto-rows: 1fr;
        gap: 2px;
        border-radius: 17px;
        overflow: hidden;
        background: #e5eadf
    }

    .fridgePhotoCollage.one {
        grid-template-columns:1fr
    }

    .fridgePhotoCollage.three .fridgePhoto:first-child {
        grid-row: span 2
    }

    .fridgePhoto {
        min-width: 0;
        min-height: 0;
        overflow: hidden;
        background: #e5eadf
    }

    .fridgePhoto img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover
    }

    .fridgeCardCheck {
        position: absolute;
        z-index: 2;
        top: 13px;
        right: 13px;
        width: 23px;
        height: 23px;
        display: grid;
        place-items: center;
        border-radius: 50%;
        border: 2px solid rgba(255, 255, 255, .94);
        color: white;
        background: rgba(9, 32, 20, .50);
        box-shadow: 0 5px 14px rgba(0, 0, 0, .18);
        font-size: 12px;
        font-weight: 950
    }

    .fridgeCard.selected .fridgeCardCheck {
        background: var(--green)
    }

    .fridgeCardBody {
        display: block;
        padding: 9px 3px 4px
    }

    .fridgeCardTitle {
        display: block;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 11px;
        font-weight: 950;
        letter-spacing: -.02em
    }

    .fridgeCardMeta {
        display: flex;
        justify-content: space-between;
        gap: 5px;
        margin-top: 5px;
        color: var(--muted);
        font-size: 7px;
        font-weight: 850
    }

    .fridgeChips {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
        margin-top: 7px
    }

    .fridgeChip {
        padding: 4px 6px;
        border-radius: 99px;
        color: var(--deep);
        background: rgba(32, 196, 111, .09);
        font-size: 7px;
        font-weight: 900
    }

    .fridgeDelete {
        width: 100%;
        margin-top: 3px;
        padding: 7px;
        border: 0;
        border-top: 1px solid rgba(15, 23, 18, .06);
        color: #97715f;
        background: transparent;
        font-size: 8px;
        font-weight: 900;
        cursor: pointer
    }

    .fridgeEmpty {
        grid-column: 1/-1;
        min-height: 285px;
        padding: 34px 20px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        border: 1px dashed rgba(14, 123, 67, .22);
        border-radius: 26px;
        background: rgba(255, 253, 247, .66)
    }

    .fridgeEmptyGlyph {
        display: grid;
        place-items: center;
        width: 58px;
        height: 58px;
        border-radius: 22px;
        background: rgba(32, 196, 111, .12);
        color: var(--deep);
        font-size: 27px
    }

    .fridgeEmpty h3 {
        margin: 14px 0 5px;
        font-size: 18px
    }

    .fridgeEmpty p {
        max-width: 240px;
        margin: 0 0 17px;
        color: var(--muted);
        font-size: 10px;
        font-weight: 750;
        line-height: 1.45
    }

    .fridgeEmpty .primary {
        width: auto;
        padding-inline: 21px
    }

    .fridgeSelectionBar {
        position: absolute;
        z-index: 7;
        left: 13px;
        right: 13px;
        bottom: 84px;
        padding: 11px 12px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        border-radius: 20px;
        color: white;
        background: rgba(5, 54, 29, .94);
        box-shadow: 0 18px 36px rgba(5, 39, 23, .28);
        backdrop-filter: blur(16px)
    }

    .fridgeSelectionBar[hidden] {
        display: none
    }

    .fridgeSelectionBar span {
        display: flex;
        min-width: 0;
        flex-direction: column
    }

    .fridgeSelectionBar b {
        font-size: 10px
    }

    .fridgeSelectionBar small {
        margin-top: 2px;
        color: rgba(255, 255, 255, .66);
        font-size: 7px;
        font-weight: 750
    }

    .fridgeSelectionBar button {
        padding: 10px 12px;
        border: 0;
        border-radius: 13px;
        color: #062616;
        background: var(--lime);
        font-size: 9px;
        font-weight: 950;
        cursor: pointer
    }

    .fridgeLoadError {
        color: #9b513d
    }

    body.desktop-mode #fridgeView.active {
        display: block !important;
        overflow-y: auto;
        background: radial-gradient(circle at 94% 8%, rgba(183, 255, 106, .25), transparent 28%),
        radial-gradient(circle at 6% 80%, rgba(32, 196, 111, .12), transparent 26%),
        #f6f0e5
    }

    body.desktop-mode .fridgeTopBar {
        margin-bottom: 22px;
        display: grid;
        grid-template-columns: auto 1fr;
    }

    body.desktop-mode .fridgeTopBar .fridgeBack {
        display: grid;
        place-items: center
    }

    body.desktop-mode .fridgeOverview .title {
        font-size: 52px
    }

    body.desktop-mode .fridgeOverview .subtitle {
        font-size: 15px
    }

    body.desktop-mode .fridgeIntroLayout {
        grid-template-columns: minmax(0, 40fr) minmax(0, 60fr);
        gap: 32px;
        align-items: stretch;
    }

    body.desktop-mode .fridgeOverview,
    body.desktop-mode .fridgeScanOptions {
        min-height: 134px;
    }

    body.desktop-mode .fridgePrivacy {
        max-width: 560px
    }

    body.desktop-mode .fridgeScanOptions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
        margin: 0;
        height: 100%;
    }

    body.desktop-mode .fridgeScanOption {
        min-height: 134px;
        height: 100%;
        padding: 15px;
        grid-template-columns: 50px minmax(0, 1fr);
        gap: 15px;
        border-radius: 25px;
    }

    body.desktop-mode .fridgeScanOptionIcon {
        width: 50px;
        height: 50px;
        border-radius: 16px;
        font-size: 27px;
    }

    body.desktop-mode .fridgeScanOptionContent h3 {
        font-size: 17px;
    }

    body.desktop-mode .fridgeScanOptionContent p {
        max-width: 210px;
        font-size: 11px;
    }

    body.desktop-mode .fridgeScanOptionContent button {
        min-height: 36px;
        padding: 8px 14px;
        font-size: 10px;
    }

    body.desktop-mode .fridgeSearch {
        max-width: 560px;
        height: 50px;
        margin-top: 14px
    }

    body.desktop-mode .fridgeGrid {
        grid-template-columns:repeat(4, minmax(0, 1fr));
        gap: 18px;
        margin-top: 22px
    }

    body.desktop-mode .fridgeCard {
        border-radius: 28px;
        padding: 9px
    }

    body.desktop-mode .fridgePhotoCollage {
        aspect-ratio: 1.3/1;
        border-radius: 21px
    }

    body.desktop-mode .fridgeCardTitle {
        font-size: 15px
    }

    body.desktop-mode .fridgeCardMeta, body.desktop-mode .fridgeChip {
        font-size: 9px
    }

    body.desktop-mode .fridgeSelectionBar {
        position: sticky;
        left: auto;
        right: auto;
        bottom: 18px;
        width: min(620px, 100%);
        margin: 20px auto 0;
        padding: 14px 16px
    }

    body.desktop-mode .fridgeSelectionBar b {
        font-size: 13px
    }

    body.desktop-mode .fridgeSelectionBar small {
        font-size: 9px
    }

    body.desktop-mode .fridgeSelectionBar button {
        font-size: 11px;
        padding: 12px 17px
    }

    body.desktop-mode .fridgeShortcut {
        display: none
    }

    body.desktop-mode .proofShortcut {
        display: none
    }

    @media (max-width: 390px) {
        .todayActions {
            gap: 4px
        }

        .fridgeShortcut {
            min-width: 43px;
            width: 43px;
            padding: 4px
        }

        .fridgeShortcut b {
            display: none
        }

        .fridgeShortcut > span {
            font-size: 16px
        }

        .proofShortcut {
            min-width: 43px;
            width: 43px;
            padding: 4px
        }

        .streak {
            padding-inline: 8px
        }
    }

    @media (min-width: 900px) and (max-width: 1180px) {
        body.desktop-mode .fridgeGrid {
            grid-template-columns:repeat(3, minmax(0, 1fr))
        }
    }