.platform-switcher {
    display: flex;
    gap: var(--spacing-1);
    padding: var(--spacing-1);
    background: var(--surface-hover);
    border: 1px solid var(--border-color);
    border-radius: var(--rounded-lg);
}

.platform-switcher-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--spacing-1);
    padding: var(--spacing-2);
    border-radius: var(--rounded-md);
    text-decoration: none;
    color: var(--text-secondary);
    font-size: var(--text-xs);
    font-weight: var(--font-semibold);
    line-height: 1.1;
    text-align: center;
    transition: all var(--transition-fast);

    i {
        font-size: var(--text-lg);
        color: var(--text-muted);
        transition: color var(--transition-fast);
    }

    &:hover {
        color: var(--text-primary);

        i {
            color: var(--text-primary);
        }
    }

    &.active {
        background: var(--surface);
        color: var(--text-primary);
        box-shadow: var(--shadow-sm);

        i {
            color: var(--primary);
        }
    }
}