/* OldGames Game Tools — shared vector icon system.
   The artwork is rendered with SVG masks, so it stays sharp at every DPI and
   cannot disappear when an icon font or emoji glyph is unavailable. */

.arcade-action-dock .arcade-header-btn {
    --og-tool-accent: #78dfff;
}

.arcade-action-dock .arcade-header-btn:has(.arcade-icon-settings) { --og-tool-accent: #45e6ff; }
.arcade-action-dock .arcade-header-btn:has(.arcade-icon-favorite) { --og-tool-accent: #ff6da8; }
.arcade-action-dock .arcade-header-btn:has(.arcade-icon-performance) { --og-tool-accent: #a5f46b; }
.arcade-action-dock .arcade-header-btn:has(.arcade-icon-emulator) { --og-tool-accent: #b59aff; }
.arcade-action-dock .arcade-header-btn:has(.arcade-icon-save) { --og-tool-accent: #65f3b5; }
.arcade-action-dock .arcade-header-btn:has(.arcade-icon-load) { --og-tool-accent: #72a9ff; }
.arcade-action-dock .arcade-header-btn:has(.og-guide-launcher-icon) { --og-tool-accent: #c58cff; }
.arcade-action-dock .arcade-header-btn:has(.arcade-icon-full) { --og-tool-accent: #072532; }
.arcade-action-dock .arcade-header-btn:has(.arcade-icon-close) { --og-tool-accent: #ff719e; }
.arcade-action-dock .arcade-header-btn:has(.arcade-icon-signin) { --og-tool-accent: #65f3b5; }

.arcade-action-dock .arcade-btn-icon {
    position: relative !important;
    isolation: isolate !important;
    display: grid !important;
    place-items: center !important;
    width: 32px !important;
    height: 32px !important;
    flex: 0 0 32px !important;
    overflow: hidden !important;
    border: 1px solid color-mix(in srgb, var(--og-tool-accent) 32%, transparent) !important;
    border-radius: 9px !important;
    color: var(--og-tool-accent) !important;
    background:
        radial-gradient(circle at 30% 20%, color-mix(in srgb, var(--og-tool-accent) 24%, transparent), transparent 48%),
        linear-gradient(145deg, rgba(19, 39, 55, .96), rgba(10, 22, 36, .96)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .08),
        0 5px 14px rgba(0, 0, 0, .28),
        0 0 14px color-mix(in srgb, var(--og-tool-accent) 10%, transparent) !important;
    filter: none !important;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}

.arcade-action-dock .arcade-btn-icon::before {
    content: "" !important;
    position: static !important;
    display: block !important;
    width: 19px !important;
    height: 19px !important;
    inset: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: currentColor !important;
    transform: none !important;
    -webkit-mask-repeat: no-repeat !important;
            mask-repeat: no-repeat !important;
    -webkit-mask-position: center !important;
            mask-position: center !important;
    -webkit-mask-size: contain !important;
            mask-size: contain !important;
}

.arcade-action-dock .arcade-btn-icon::after {
    content: "" !important;
    position: absolute !important;
    right: 4px !important;
    bottom: 4px !important;
    left: auto !important;
    top: auto !important;
    display: block !important;
    width: 3px !important;
    height: 3px !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: currentColor !important;
    box-shadow: 0 0 7px currentColor !important;
    opacity: .62 !important;
    transform: none !important;
}

.arcade-action-dock .arcade-icon-settings::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.8'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M4%206h6M14%206h6M4%2012h2M10%2012h10M4%2018h9M17%2018h3'/%3E%3Ccircle%20cx='12'%20cy='6'%20r='2'/%3E%3Ccircle%20cx='8'%20cy='12'%20r='2'/%3E%3Ccircle%20cx='15'%20cy='18'%20r='2'/%3E%3C/svg%3E") !important;
            mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.8'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M4%206h6M14%206h6M4%2012h2M10%2012h10M4%2018h9M17%2018h3'/%3E%3Ccircle%20cx='12'%20cy='6'%20r='2'/%3E%3Ccircle%20cx='8'%20cy='12'%20r='2'/%3E%3Ccircle%20cx='15'%20cy='18'%20r='2'/%3E%3C/svg%3E") !important;
}

.arcade-action-dock .arcade-icon-favorite::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.8'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M20.8%204.6a5.4%205.4%200%200%200-7.6%200L12%205.8l-1.2-1.2a5.4%205.4%200%200%200-7.6%207.6L12%2021l8.8-8.8a5.4%205.4%200%200%200%200-7.6Z'/%3E%3C/svg%3E") !important;
            mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.8'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M20.8%204.6a5.4%205.4%200%200%200-7.6%200L12%205.8l-1.2-1.2a5.4%205.4%200%200%200-7.6%207.6L12%2021l8.8-8.8a5.4%205.4%200%200%200%200-7.6Z'/%3E%3C/svg%3E") !important;
}

.arcade-action-dock .arcade-icon-performance::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.8'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M4%2018a8%208%200%200%201%2016%200M6.8%2012.5l-1.7-1M12%2010V8M17.2%2012.5l1.7-1M12%2016l4-4M6%2019h12'/%3E%3Ccircle%20cx='12'%20cy='16'%20r='1.5'/%3E%3C/svg%3E") !important;
            mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.8'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M4%2018a8%208%200%200%201%2016%200M6.8%2012.5l-1.7-1M12%2010V8M17.2%2012.5l1.7-1M12%2016l4-4M6%2019h12'/%3E%3Ccircle%20cx='12'%20cy='16'%20r='1.5'/%3E%3C/svg%3E") !important;
}

.arcade-action-dock .arcade-icon-emulator::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.7'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='6'%20y='6'%20width='12'%20height='12'%20rx='2'/%3E%3Crect%20x='9'%20y='9'%20width='6'%20height='6'%20rx='1'/%3E%3Cpath%20d='M9%202v4M15%202v4M9%2018v4M15%2018v4M2%209h4M2%2015h4M18%209h4M18%2015h4'/%3E%3C/svg%3E") !important;
            mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.7'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='6'%20y='6'%20width='12'%20height='12'%20rx='2'/%3E%3Crect%20x='9'%20y='9'%20width='6'%20height='6'%20rx='1'/%3E%3Cpath%20d='M9%202v4M15%202v4M9%2018v4M15%2018v4M2%209h4M2%2015h4M18%209h4M18%2015h4'/%3E%3C/svg%3E") !important;
}

.arcade-action-dock .arcade-icon-save::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.7'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M5%203h11l3%203v15H5zM8%203v6h8V3M8%2021v-7h8v7'/%3E%3Ccircle%20cx='15'%20cy='6'%20r='.8'%20fill='black'%20stroke='none'/%3E%3C/svg%3E") !important;
            mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.7'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M5%203h11l3%203v15H5zM8%203v6h8V3M8%2021v-7h8v7'/%3E%3Ccircle%20cx='15'%20cy='6'%20r='.8'%20fill='black'%20stroke='none'/%3E%3C/svg%3E") !important;
}

.arcade-action-dock .arcade-icon-load::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.8'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M3%207h7l2%202h9v11H3zM12%2011v6M9%2014l3%203%203-3'/%3E%3C/svg%3E") !important;
            mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.8'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M3%207h7l2%202h9v11H3zM12%2011v6M9%2014l3%203%203-3'/%3E%3C/svg%3E") !important;
}

.arcade-action-dock .og-guide-launcher-icon::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.7'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M4%204.5C6%203.5%208.4%203.6%2011%205v15c-2.6-1.4-5-1.5-7-.5zM20%204.5c-2-1-4.4-.9-7%20.5v15c2.6-1.4%205-1.5%207-.5zM12%205v15'/%3E%3C/svg%3E") !important;
            mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.7'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M4%204.5C6%203.5%208.4%203.6%2011%205v15c-2.6-1.4-5-1.5-7-.5zM20%204.5c-2-1-4.4-.9-7%20.5v15c2.6-1.4%205-1.5%207-.5zM12%205v15'/%3E%3C/svg%3E") !important;
}

.arcade-action-dock .arcade-icon-full::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M4%209V4h5M15%204h5v5M20%2015v5h-5M9%2020H4v-5'/%3E%3C/svg%3E") !important;
            mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M4%209V4h5M15%204h5v5M20%2015v5h-5M9%2020H4v-5'/%3E%3C/svg%3E") !important;
}

.arcade-action-dock .arcade-icon-close::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M12%203v8M7.1%205.8a8%208%200%201%200%209.8%200'/%3E%3C/svg%3E") !important;
            mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M12%203v8M7.1%205.8a8%208%200%201%200%209.8%200'/%3E%3C/svg%3E") !important;
}

.arcade-action-dock .arcade-icon-signin::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.8'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M10%205H5v14h5M13%208l4%204-4%204M8%2012h9'/%3E%3C/svg%3E") !important;
            mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='1.8'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M10%205H5v14h5M13%208l4%204-4%204M8%2012h9'/%3E%3C/svg%3E") !important;
}

.arcade-action-dock .arcade-header-btn:hover .arcade-btn-icon,
.arcade-action-dock .arcade-header-btn:focus-visible .arcade-btn-icon {
    border-color: color-mix(in srgb, var(--og-tool-accent) 72%, white 8%) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .12),
        0 7px 18px rgba(0, 0, 0, .3),
        0 0 20px color-mix(in srgb, var(--og-tool-accent) 25%, transparent) !important;
    transform: translateY(-1px) scale(1.04) !important;
}

.arcade-action-dock .arcade-header-btn.is-favorited {
    --og-tool-accent: #ffe46f;
}

@media (min-width: 980px) {
    body.nexus-exact-player.arcade-player-ui:not(:has(.mp-arena-v6)) .arcade-action-dock .arcade-header-btn {
        grid-template-columns: 36px minmax(0, 1fr) !important;
        gap: 10px !important;
        min-height: 58px !important;
    }

    body.nexus-exact-player.arcade-player-ui:not(:has(.mp-arena-v6)) .arcade-action-dock .arcade-btn-icon {
        width: 36px !important;
        height: 36px !important;
        flex-basis: 36px !important;
        border-radius: 10px !important;
    }

    body.nexus-exact-player.arcade-player-ui:not(:has(.mp-arena-v6)) .arcade-action-dock .arcade-btn-icon::before {
        width: 21px !important;
        height: 21px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .arcade-action-dock .arcade-btn-icon { transition: none !important; }
}
