/* Shared by /Rank and /RankEffectsPreview; scoped to ranking popups. */
.rfx .popup-win {
    width: min(460px, calc(100vw - 24px)) !important;
    height: auto !important;
    max-height: calc(100dvh - 24px);
    position: fixed !important;
    z-index: 1050;
    background: var(--rfx-surface);
    border: 1px solid var(--rfx-line);
    border-radius: 12px;
    box-shadow: 0 16px 48px #07142640;
}
.rfx .popup-win-header {
    padding: 12px 16px;
    min-height: 56px;
    border-bottom: 1px solid var(--rfx-line);
    cursor: move;
}
.rfx .popup-win-title { color: var(--rfx-text); line-height: 1.5; }
.rfx .popup-win-close { width: 32px; height: 32px; flex-shrink: 0; }
.rfx .popup-win-close:focus-visible { outline: 2px solid var(--rfx-accent); }
.rfx .popup-win-body {
    height: auto !important;
    width: 100% !important;
    min-height: 0;
    max-height: calc(100dvh - 82px);
    padding: 12px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-color: var(--rfx-muted) var(--rfx-surface);
    background: var(--rfx-surface);
    border-top: 0;
    display: block;
}
.rfx .chain-body .wrapper {
    width: 100%;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 20px auto auto auto auto auto;
    margin: 0 0 12px;
    padding: 0 12px 8px;
    gap: 8px 0;
    border: 1px solid var(--rfx-line);
    border-radius: 8px;
    overflow: hidden;
    background: var(--rfx-stripe);
}
.rfx .chain-body > .wrapper:last-child { margin-bottom: 0; }
.rfx .chain-body .box1 { margin: 0 -12px; border: 0; background: var(--rfx-head); border-radius: 0; }
.rfx .chain-body .box1-1 { display: none; }
.rfx .chain-body .box2 { white-space: normal; overflow-wrap: anywhere; line-height: 1.6; }
.rfx .chain-body .chain-title-text { color: var(--rfx-accent); font-weight: 600; }
.rfx .chain-body .box3 { grid-template-columns: minmax(0, 150px) minmax(0, 1fr); gap: 10px; min-width: 0; font-size: 12px; }
.rfx .chain-body .up-img-area { color: var(--rfx-red) !important; }
.rfx .chain-body .down-img-area { color: var(--rfx-green) !important; }
.rfx .chain-body .box3-1, .rfx .chain-body .box3-2, .rfx .chain-body .box4 { min-width: 0; }
.rfx .chain-body .box3-3 { display: none; }
.rfx .chain-body .box4, .rfx .chain-body .box5, .rfx .chain-body .box6 { grid-column: 1 / -1; }
.rfx .chain-body .box-stock-list { grid-template-columns: minmax(0, 1fr) repeat(3, minmax(0, 42px)); column-gap: 4px; font-variant-numeric: tabular-nums; }
.rfx .chain-body .box4 { height: auto; overflow: hidden; }
.rfx .chain-body .box4 a { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.7; }
.rfx .chain-body .box5, .rfx .chain-body .box6 { color: var(--rfx-muted); height: auto; }
.rfx .chain-body .box6 { border-top: 1px solid var(--rfx-line); padding-top: 6px; }
.rfx .chain-body > .chain-card, .rfx .video-body .video-card-body { width: 100%; max-width: 100%; flex: none; }
.rfx .chain-body > .chain-card { padding: 0; border: 0; background: transparent !important; }
.rfx .chain-body .chain-card-body { padding: 0; }
.rfx .popup-win .loading { display: block; width: 32px; height: 32px; margin: 24px auto; }
@media (max-width: 480px) {
    .rfx .popup-win { width: calc(100vw - 16px) !important; max-height: calc(100dvh - 16px); }
    .rfx .popup-win-body { max-height: calc(100dvh - 74px); padding: 10px; }
    .rfx .chain-body .box3 { grid-template-columns: minmax(0, 1fr); }
    .rfx .chain-body .box3-2 { grid-column: 1; }
}
