/* 掛機收穫：桌面是置中結算面板，手機是底部抽屜。資料仍由 mobileOpenAwaySheet() 提供。 */
body[data-msheet="away"] #m-scrim {
    top: 0;
    bottom: var(--vp-cut, 0px);
    left: 0;
    right: 0;
    background: rgba(5, 11, 12, .73);
}

#m-awaysheet {
    overflow: hidden;
    border: 1px solid #8f9276;
    background: var(--ed-surface);
    color: var(--ed-text);
    box-shadow: 0 30px 95px #000b;
}
#m-awaysheet-grip { display: none; }
#m-awaysheet-head {
    min-height: 112px;
    padding: 20px 35px;
    border-bottom: 1px solid var(--ed-line);
    background: linear-gradient(115deg, #273632, #1b2929 70%);
}
#m-awaysheet-head > span { min-width: 0; }
#m-awaysheet-head em {
    display: block;
    margin-bottom: 8px;
    color: var(--ed-gold-light);
    font-size: 10px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: .2em;
}
#m-awaysheet-head strong { display: block; color: var(--ed-text); font-size: 28px; line-height: 1.2; letter-spacing: .09em; }
#m-awaysheet-head small { margin-top: 7px; color: #b8c7bb; font-size: 12px; font-weight: 400; }
#m-awaysheet-head button {
    flex: 0 0 45px;
    width: 45px;
    height: 45px;
    border: 1px solid #65746b;
    background: #243330;
    color: #d1d9cf;
    font-size: 22px;
}
#m-awaysheet-head button:hover { border-color: var(--ed-gold); color: var(--ed-gold-light); }

#m-awaysheet-gold[hidden] { display: none !important; }
#m-awaysheet-gold.awrow {
    display: flex;
    align-items: center;
    gap: 22px;
    flex: 0 0 104px;
    min-height: 104px;
    margin: 18px 35px 10px;
    padding: 17px 21px;
    border: 1px solid #887b5e;
    background: linear-gradient(95deg, #3e3828, #282f2a 68%, #222f2e);
}
.away-coin {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    border: 1px solid #8d7750;
    background: #2c2b20;
}
#m-awaysheet-gold .away-coin img { width: 40px; height: 40px; object-fit: contain; image-rendering: pixelated; }
.away-gold-copy { flex: 1; min-width: 0; }
.away-gold-copy small { display: block; color: #dcc69a; font-size: 10px; font-weight: 800; letter-spacing: .16em; }
.away-gold-copy strong { display: block; margin-top: 6px; color: #f2dfb4; font-size: 31px; line-height: 1.1; font-variant-numeric: tabular-nums; }
.away-gold-copy strong::after { content: ' 金幣'; color: #c8b68e; font-size: 13px; }
.away-gold-note { color: #b6bda9; font-size: 11px; white-space: nowrap; }

#m-awaysheet-loot-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex: 0 0 40px;
    margin: 0 35px;
    border-bottom: 1px solid var(--ed-line);
}
#m-awaysheet-loot-head b { font-size: 13px; letter-spacing: .1em; }
#m-awaysheet-loot-head span { color: var(--ed-muted); font-size: 11px; white-space: nowrap; }
#m-awaysheet-body {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-content: start;
    gap: 0 32px;
    flex: 1 1 auto;
    min-height: 0;
    padding: 1px 35px 4px;
    overflow-x: hidden;
    overflow-y: auto;
    background: var(--ed-surface);
    scrollbar-width: thin;
    scrollbar-color: #6c7567 #1c2928;
}
.away-loot-col { display: flex; flex-direction: column; min-width: 0; }
#m-awaysheet-body .awrow {
    min-height: 48px;
    padding: 4px 3px;
    border-bottom: 1px solid var(--ed-line-soft);
    background: var(--ed-surface);
}
#m-awaysheet-body .awrow img { width: 29px; height: 29px; flex: 0 0 29px; image-rendering: pixelated; }
#m-awaysheet-body .awrow .awn { font-size: 12px; font-weight: 600; }
#m-awaysheet-body .awrow .awc { color: #d9e0d6; font-size: 13px; font-weight: 800; }
#m-awaysheet-body .awempty { grid-column: 1 / -1; margin: 15px 0; color: var(--ed-muted); }

#m-awaysheet-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    flex: 0 0 72px;
    padding: 0 35px;
    border-top: 1px solid var(--ed-line);
    background: #1a2626;
}
#m-awaysheet-stored { color: #9eb4a6; font-size: 11px; }
#m-awaysheet-foot button {
    min-width: 154px;
    min-height: 44px;
    padding: 0 21px;
    border: 1px solid #d4bc8a;
    background: #cbb17f;
    color: #15201e;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
}
#m-awaysheet-foot button:hover { background: #e1c791; }

@media (min-width: 768px) {
    #m-awaysheet {
        top: 50%;
        bottom: auto;
        left: 50%;
        right: auto;
        width: min(820px, calc(100vw - 54px));
        height: min(655px, calc(var(--app-h, 100dvh) - 90px));
        max-height: none;
        padding-bottom: 0;
        transform: translate(-50%, -50%);
        transition: none;
    }
    body[data-msheet="away"] #m-awaysheet { transform: translate(-50%, -50%); }
    #m-awaysheet::before, #m-awaysheet::after {
        content: '';
        position: absolute;
        z-index: 2;
        width: 21px;
        height: 21px;
        pointer-events: none;
        border-color: var(--ed-gold-light);
        border-style: solid;
    }
    #m-awaysheet::before { top: 7px; left: 7px; border-width: 2px 0 0 2px; }
    #m-awaysheet::after { top: 7px; right: 7px; border-width: 2px 2px 0 0; }
}

@media (max-width: 767px) {
    #m-awaysheet {
        top: auto;
        right: 0;
        bottom: var(--vp-cut, 0px);
        left: 0;
        width: 100%;
        height: min(742px, calc(var(--app-h, 100dvh) - 105px - var(--vp-cut, 0px)));
        max-height: none;
        padding-bottom: 0;
        border-right: 0;
        border-bottom: 0;
        border-left: 0;
        transform: translateY(102%);
    }
    body[data-msheet="away"] #m-awaysheet { transform: translateY(0); }
    #m-awaysheet-grip { display: block; position: absolute; top: 9px; left: calc(50% - 19px); margin: 0; background: #7c8981; }
    #m-awaysheet-head { min-height: 109px; padding: 19px 17px 13px; }
    #m-awaysheet-head em { margin-bottom: 6px; font-size: 9px; }
    #m-awaysheet-head strong { font-size: 21px; }
    #m-awaysheet-head small { font-size: 11px; }
    #m-awaysheet-head button { flex-basis: 42px; width: 42px; height: 42px; font-size: 20px; }
    #m-awaysheet-gold.awrow { gap: 14px; flex-basis: 90px; min-height: 90px; margin: 12px 15px 6px; padding: 11px 13px; }
    .away-coin { width: 45px; height: 45px; flex-basis: 45px; }
    #m-awaysheet-gold .away-coin img { width: 34px; height: 34px; }
    .away-gold-copy strong { font-size: 25px; }
    .away-gold-note { display: none; }
    #m-awaysheet-loot-head { flex-basis: 38px; margin: 0 16px; }
    #m-awaysheet-body { display: block; padding: 0 16px 8px; }
    .away-loot-col { display: contents; }
    #m-awaysheet-body .awrow { min-height: 48px; }
    #m-awaysheet-body .awrow img { width: 32px; height: 32px; flex-basis: 32px; }
    #m-awaysheet-foot { flex-basis: 74px; padding: 0 16px env(safe-area-inset-bottom); }
    #m-awaysheet-stored { max-width: 128px; font-size: 10px; line-height: 1.35; }
    #m-awaysheet-foot button { min-width: 141px; padding: 0 11px; }
}

@media (prefers-reduced-motion: reduce) {
    #m-awaysheet { transition: none; }
}