/* Complete supplied tiles: frame and icon are already composed in each PNG. */
/* Figma 3893:1749: the horizontal artwork is above the curved background,
   with its visible border aligned to the last curved tile's shoulder. */
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right { z-index: 142; }
#s .game-wrapper.ui-flat-v2 #pane-right .messages { --tile: url('../images/new/menu/right-messages.png'); --tile-disabled: url('../images/new/menu/disabled/right-messages.png?v=2'); --tile-active: url('../images/new/menu/right-messages-active.png'); }
#s .game-wrapper.ui-flat-v2 #pane-right .log { --tile: url('../images/new/menu/right-log.png'); --tile-disabled: url('../images/new/menu/disabled/right-log.png?v=2'); --tile-active: url('../images/new/menu/right-log-active.png'); }
#s .game-wrapper.ui-flat-v2 #pane-right .video-list { --tile: url('../images/new/menu/right-video-list.png'); --tile-disabled: url('../images/new/menu/disabled/right-video-list.png?v=2'); --tile-active: url('../images/new/menu/right-video-list-active.png'); }
#s .game-wrapper.ui-flat-v2 #pane-right .achievement-list { --tile: url('../images/new/menu/right-achievement-list.png'); --tile-disabled: url('../images/new/menu/disabled/right-achievement-list.png?v=2'); --tile-active: url('../images/new/menu/right-achievement-list-active.png'); }
#s .game-wrapper.ui-flat-v2 #pane-right .report-cashflow { --tile: url('../images/new/menu/right-report-cashflow.png'); --tile-disabled: url('../images/new/menu/disabled/right-report-cashflow.png?v=2'); --tile-active: url('../images/new/menu/right-report-cashflow-active.png'); }
#s .game-wrapper.ui-flat-v2 #pane-right .report-operation { --tile: url('../images/new/menu/right-report-operation.png'); --tile-disabled: url('../images/new/menu/disabled/right-report-operation.png?v=2'); --tile-active: url('../images/new/menu/right-report-operation-active.png'); }
#s .game-wrapper.ui-flat-v2 #pane-right .report-pl { --tile: url('../images/new/menu/right-report-pl.png'); --tile-disabled: url('../images/new/menu/disabled/right-report-pl.png?v=2'); --tile-active: url('../images/new/menu/right-report-pl-active.png'); }
#s .game-wrapper.ui-flat-v2 #pane-right .report-ranking { --tile: url('../images/new/menu/right-report-ranking.png'); --tile-disabled: url('../images/new/menu/disabled/right-report-ranking.png?v=2'); --tile-active: url('../images/new/menu/right-report-ranking-active.png'); }
#s .game-wrapper.ui-flat-v2 #pane-right .report { --tile: url('../images/new/menu/right-report.png'); --tile-disabled: url('../images/new/menu/disabled/right-report.png?v=2'); --tile-active: url('../images/new/menu/right-report-active.png'); }

#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .flat-menu-shape { display: none; }
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right > .pane-node > .flat-menu-symbol,
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-node.report .pane-sub-image {
    left: var(--menu-icon-left);
    top: auto;
    bottom: 14.5692px;
    width: 50.41px;
    height: 46.3px;
    background: var(--tile) center bottom / contain no-repeat;
}
/* Match the visible light-blue border height, not the different PNG canvases.
   55 * 169/257 = 49.7 * 155/213. Normal/active PNGs share these bounds. */
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right > .pane-node.messages > .flat-menu-symbol {
    width: 55.128px;
    bottom: 15.0009px;
}
/* Compact count badge at the envelope's upper-right; leave count semantics intact.
   Multiple digits may widen the pill, but do not grow over the envelope. */
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-node > #unviewed-messages-count {
    position: absolute;
    z-index: 6;
    left: auto;
    right: 6px;
    top: -2px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-width: 16px;
    width: auto;
    height: 16px;
    padding: 0 3px;
    border: 1px solid #fff;
    border-radius: 8px;
    background: #ff5c5c;
    color: #fff;
    font: 600 11px/1 Arial, sans-serif;
    white-space: nowrap;
    text-shadow: none;
    box-shadow: none;
    transform: none;
    pointer-events: none;
}
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-node:not(.pane-disabled):is(:active, .active, .pane-node-highlight),
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-subnode:not(.pane-disabled):is(:active, .active) {
    filter: none;
}
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right > .pane-node:not(.pane-disabled):is(:active, .active, .pane-node-highlight) > .flat-menu-symbol,
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-subnode:not(.pane-disabled):is(:active, .active) > .pane-sub-image {
    background-image: var(--tile-active);
}
/* Account for the different transparent PNG margins while retaining the
   original Figma base origins. */
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right > .pane-node + .pane-node,
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right > .pane-node.video-list {
    margin-left: var(--menu-overlap, -9.9px);
}
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-node.report .pane-subnode + .pane-subnode {
    margin-left: -9.9px;
}
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-node.report .pane-subnode-wrapper {
    left: 58px;
    width: 241.9px;
}
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-node.report.pane-expandable:not(.pane-disabled):hover,
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-node.report.pane-expandable:not(.pane-disabled):focus-within,
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-node.report.pane-expandable:not(.pane-disabled).pane-node-highlight {
    flex-basis: 299.9px;
    width: 299.9px;
}
/* A disabled report group must keep the same quiet state on hover/focus.
   Its unavailable children remain hidden while enabled groups still expand. */
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-node.report.pane-expandable.pane-disabled {
    flex: 0 0 67.9px;
    width: 67.9px;
}
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-node.report.pane-disabled .pane-subnode-wrapper {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

/* Swap only the tile artwork; the light/dark blue step below remains intact. */
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right > .pane-node.pane-disabled > .flat-menu-symbol,
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-subnode.pane-disabled > .pane-sub-image {
    background-image: var(--tile-disabled);
}

/* Figma 3893:1749, original coordinates at the existing 0.71 asset scale.
   Crop the original shared SVG in place instead of approximating its slopes
   with repeated trapezoids. Overlapping slices paint identical source pixels. */
#s .game-wrapper.ui-flat-v2 #pane-right > .messages { --menu-base-x: 271.274px; --menu-icon-left: 3.133px; }
#s .game-wrapper.ui-flat-v2 #pane-right > .log { --menu-base-x: 329.6601px; --menu-icon-left: 6.532px; --menu-overlap: -9.5139px; }
#s .game-wrapper.ui-flat-v2 #pane-right > .report { --menu-base-x: 388.6256px; --menu-icon-left: 8.6336px; --menu-overlap: -8.9345px; }
#s .game-wrapper.ui-flat-v2 #pane-right > .video-list { --menu-base-x: 448.8293px; --menu-icon-left: 6.6428px; --menu-overlap: -7.6963px; }
#s .game-wrapper.ui-flat-v2 #pane-right > .achievement-list { --menu-base-x: 507.1608px; --menu-icon-left: 8.2992px; --menu-overlap: -9.5685px; }
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right > .pane-node:is(.messages,.log,.video-list,.achievement-list)::before {
    height: 36.3px;
    background-image: url('../images/new/menu/menu-left-figma-background.svg');
    background-size: 574.168px 180.695px;
    background-position: calc(0px - var(--menu-base-x)) bottom;
}
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right > .pane-node.report::before,
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-node.report .pane-subnode::before {
    bottom: .3543px;
    width: 67.008px;
    height: 35.9264px;
    background: url('../images/new/menu/menu-report-base-figma.svg') left bottom / contain no-repeat;
}
/* Match the report group's height and slope at both expanded-menu seams. */
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-node.report .pane-sub-image {
    left: 8.6336px;
}

/* Hover belongs to this base only. Filtering a whole node also brightens the
   neighbouring shapes in its shared SVG slice and puts a glow outside it.
   These contours are the original Figma paths at the same .71 asset scale. */
#s .game-wrapper.ui-flat-v2 #pane-right > .messages {
    --menu-highlight-shape: polygon(58.3868px .2987px, 0 2.0496px, 9.531px 35.945px, 65.7992px 35.945px);
}
#s .game-wrapper.ui-flat-v2 #pane-right > .log,
#s .game-wrapper.ui-flat-v2 #pane-right > .video-list {
    --menu-highlight-shape: polygon(58.9669px .0183px, 0 .2959px, 6.7429px 35.945px, 66.1706px 35.945px);
}
#s .game-wrapper.ui-flat-v2 #pane-right > .report {
    --menu-highlight-shape: polygon(60.2009px .2963px, 0 .019px, 7.2065px 35.9454px, 67.008px 35.9454px);
}
#s .game-wrapper.ui-flat-v2 #pane-right > .achievement-list {
    --menu-highlight-shape: polygon(61.2503px .09px, 0 .09px, 7.2065px 36.016px, 67.0077px 36.016px);
}
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right > .pane-node,
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right > .pane-node:not(.pane-disabled):is(:hover, :focus-visible, .pane-node-highlight),
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-subnode:not(.pane-disabled):hover {
    filter: none;
}
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right > .pane-node::after,
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-subnode::after {
    content: "";
    display: block;
    position: absolute;
    inset: auto auto 0 0;
    width: 67.9px;
    height: 36.3px;
    background: #61d8f0;
    clip-path: var(--menu-highlight-shape);
    transform: none;
    opacity: 0;
    z-index: 1;
    pointer-events: none;
}
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-subnode::after {
    clip-path: var(--menu-highlight-shape);
}
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right > .pane-node:not(.pane-disabled):is(:hover, :focus-visible, .pane-node-highlight)::after,
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-subnode:not(.pane-disabled):is(:hover, :focus-visible)::after {
    opacity: 1;
}

/* Keep zero-count messages quiet, including after the last unread item is read. */
#s .game-wrapper.ui-flat-v2 #pane-right.pane.right .pane-node > #unviewed-messages-count[hidden] { display: none; }